/* DEV */
#inspector {
    position: absolute;
    bottom: 0px;
    width: 600px;
    right: 0px;
    height: 50%;
    background: #fff;
    box-sizing: border-box;
    padding: 15px 30px 30px;
    overflow: scroll;
    border: 1px solid #dedede;
    /* z-index: 2000; */
    display: none !important;
}
.dark #inspector {
    background: #1b1b1b;
    color: white;
    border: 1px solid #282828;
}
#inspector.hide-inspector {
    overflow: hidden;
    height: 40px;
}
@media screen and (max-width: 39.9375em) {
	#inspector {
        width: 100% !important;
        /* display: none !important; */
    }
}

/* BODY SETUP */
body {
    height: 100vh;
    overflow: hidden;
    width: 100%;
    background: white;
}
body.dark {
    background: #1B1B1B;
    color: white;
}

/* SCROLLBARS */
@media (hover: hover) {
    ::-webkit-scrollbar-track {
        background-color: #fff;
    }
    ::-webkit-scrollbar {
        width: 10px;
        background-color: #cccccc;
    }
    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #cccccc;
    }
    .dark ::-webkit-scrollbar-track {
        background-color: #1b1b1b;
    }
    .dark ::-webkit-scrollbar {
        width: 10px;
        background-color: #333;
    }
    .dark ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #333;
    }
}
body {
    scrollbar-color: #ccc #fff;
}
body.dark {
    scrollbar-color: #333 #1b1b1b;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}
.margin-top-10 {
    margin-top: 10px;
}
.margin-right-10 {
    margin-right: 10px;
}
.margin-left-10 {
    margin-left: 10px;
}
.margin-bottom-20 {
    margin-bottom: 20px;
}
.margin-top-20 {
    margin-top: 20px;
}
.margin-right-20 {
    margin-right: 20px;
}
.margin-left-20 {
    margin-left: 20px;
}
.margin-bottom-30 {
    margin-bottom: 30px;
}
.margin-top-30 {
    margin-top: 30px;
}
.margin-right-30 {
    margin-right: 30px;
}
.margin-left-30 {
    margin-left: 30px;
}
a {
    color: #0096B5;
}

hr {
    border-color: #dedede;
}
.dark hr {
    border-color: #2d2d2d;
}
a.link {
    font-size: 16px;
    padding-right: 18px;
    background: url(/img/library/icons/icon-right-arrow-blue.svg) no-repeat right center;
    background-size: auto 12px;
    display: inline-block;
}
a.link:hover {
    text-decoration: underline;
}
.dark a.link {
    background: url(/img/library/icons/icon-right-arrow-blue-accent.svg) no-repeat right center;
    background-size: auto 12px;
}
.br-5 {
    border-radius: 5px;
}
.br-10 {
    border-radius: 10px;
}

nowrap,
.nowrap {
  white-space: nowrap;
}
.small-text {
  font-size: 12px;
}
.medium-text {
  font-size: 14px;
}

.button {
    font-weight: 600;
    font-size: 1rem;
    border-radius: 5px;
}
.button.hollow:hover {
    color: #0096B5;
    border: 1px solid #0096B5;
}
.dark .button {
    background-color: #0096B5;
}
.dark .button:hover {
    background-color: #007c96;
}
.dark .button.hollow {
    background-color: transparent;
    color: #0096B5;
    border: 1px solid #0096B5;
}
.dark .button.hollow:hover {
    background-color: transparent;
    color: #4BC1D2;
    border: 1px solid #4BC1D2;
}
.button.add-button {
    font-weight: 400;
    font-size: 16px;
    padding-left: 50px;
    position: relative;
    border-radius: 100px;
    color: #0096B5;
    background-color: #eaf8fd;
}
.button.add-button:before {
    content: "+";
    font-weight: 200;
    color: #eaf8fd;
    position: absolute;
    left: 2px;
    top: 2px;
    bottom: 2px;
    width: 34px;
    font-size: 26px;
    line-height: 1.3em;
    border-radius: 100%;
    background-color: #4BC1D2;
}
.button.secondary {
    background-color: #efefef;
    color: #03151E;
    font-weight: normal;
}
.dark .button.secondary {
    background-color: #3A3B3C;
    color: white;
}
.button.delete {
    background: url(/img/library/datatables/delete-white.svg) no-repeat right 15px top 10px #DF6C5E;
    background-size: 12px auto;
    color: #fff;
    padding-right: 40px;
}
.button.delete.small {
    background-position: right 12px top 6px;
    padding-right: 34px;
    background-size: 11px auto;
}
.button.delete:hover, .button.delete:active {
    background: url(/img/library/datatables/delete-white.svg) no-repeat right 15px top 10px;
    background-size: 12px auto;
    background-color: #EC7D78;
    color: white;
}
.dark .button.delete:hover, .dark .button.delete:active {
    background: url(/img/library/datatables/delete-white.svg) no-repeat right 15px top 10px;
    background-size: 12px auto;
    background-color: #B95049;
    color: white;
}
.button.delete.small:hover, .button.delete.small:active {
    background-position: right 12px top 6px;
    padding-right: 34px;
    background-size: 11px auto;
}
.button.delete.loading {
    background-image: url('/img/public/icons/loading.svg') !important;
    background-repeat: no-repeat;
    background-position: right 10px center !important;
    background-size: 25px auto !important;
    padding-right: 50px !important;
}
.dark .button.alert {
    background: #DF6C5E;
    color: white;
}
.button.outline-blue {
    border: 2px solid #4BC1D2;
    background: #e8f8ff;
    color: #4BC1D2;
}
.button.outline-blue:hover {
    border: 2px solid #0096B5;
    background: #0096B5;
    color: #fff;
}
h1.admin-title {
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 40px;
}
.secondary-title {
  color: #03151E;
  font-size: 18px;
  font-weight: bold;
  padding-bottom: 15px;
}
.dark .secondary-title {
  color: #FFFFFF;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	h1.admin-title {
        margin-bottom: 30px;
    }
}
@media screen and (max-width: 39.9375em) {
	h1.admin-title {
        font-size: 30px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
}
.arrow-collapse,
.ellipses-expand {
  font-weight: bold;
}
.admin-tabs {
    border-bottom: 1px solid #dedede;
    margin-bottom: 30px;
}
.admin-tabs.medium {
    padding-bottom: 9px;
    margin-top: -10px;
}
.admin-tabs.mini {
  margin-bottom: 40px;
}
.admin-tabs.mini li {
  margin-right: 40px;
  margin-left: 0px;
}
.admin-tabs.mini li span.anchor,
.admin-tabs.mini li a {
  display: inline-block;
  padding: 0px 0px 10px;
  font-size: 16px;
  cursor: pointer;
}
.admin-tabs.mini li.active span.anchor,
.admin-tabs.mini li.active a {
  border-bottom: 2px solid #4BC1D2;
}
.admin-tabs.no-margin {
    margin-bottom: 0px;
}
.dark .admin-tabs {
    border-bottom: 1px solid #282828;
}
.dark .admin-tabs:empty,
.admin-tabs:empty {
  border-bottom: none;
}
.admin-tabs li {
    margin-left: 40px;
    cursor: pointer;
}
.admin-tabs.medium li {
    margin-right: 40px;
    margin-left: 0px;
    margin-top: 10px;
}
.admin-tabs li:first-child {
    margin-left: 0px;
}
.admin-tabs li span.anchor,
.admin-tabs li a {
    padding: 18px 0px;
    font-weight: bold;
    color: #bbb;
    font-size: 24px;
}
.admin-tabs.medium li span.anchor,
.admin-tabs.medium li a {
    padding: 10px 0px;
    font-weight: bold;
    color: #bbb;
    font-size: 20px;
}
.admin-tabs li.active span.anchor,
.admin-tabs li.active a {
    color: #03151E;
    background: transparent;
    border-bottom: 3px solid #4BC1D2;
}
.admin-tabs li span.anchor:active,
.admin-tabs li span.anchor:focus,
.admin-tabs li a:active,
.admin-tabs li a:focus {
    background: transparent;
}
.dark .admin-tabs li.active span.anchor,
.dark .admin-tabs li.active a {
    color: white;
}
.admin-tabs li:hover span.anchor,
.admin-tabs li:hover a {
    color: #03151E;
}
.dark .admin-tabs li:hover span.anchor,
.dark .admin-tabs li:hover a {
    color: white;
}
.admin-tabs .tab-border {
    border-bottom: 3px solid #4BC1D2;
    position: absolute;
    bottom: 0;
    width: 0;
    opacity: 0;
}
.admin-tabs.item-details-menu-2 li {
  position: relative;
}
.admin-tabs.item-details-menu-2 li a {
    padding-right: 40px;
}
  .admin-tabs .badge {
    position: absolute;
    top: 16px;
    right: 0px;
    font-size: 12px;
    border-radius: 4px;
    background: #ececec;
    color: #03151E;
  }
  .dark .admin-tabs .badge {
      background: #404040;
      color: #fff;
  }
@media screen and (max-width: 63.9375em) {
	.admin-tabs .tab-border {
        display: none;
    }
    .admin-tabs.medium {
        padding-bottom: 8px;
    }
    .admin-tabs li {
        margin-left: 30px;
    }
    .admin-tabs.mini li {
        padding-bottom: 0px;
    }
    .admin-tabs.mini li {
        margin-left: 0px;
        margin-right: 20px;
    }
    .admin-tabs.medium li span.anchor,
    .admin-tabs.medium li a {
        padding-bottom: 5px;
    }
    .admin-tabs.mini li span.anchor,
    .admin-tabs.mini li a {
        font-size: 16px;
        padding: 0px 0px 10px;
    }
    .admin-tabs li span.anchor,
    .admin-tabs li a {
        padding: 15px 0px 12px;
        border-bottom: 3px solid transparent;
        font-size: 20px;
    }
    .admin-tabs.medium li span.anchor,
    .admin-tabs.medium li a {
        padding: 10px 0px;
        border-bottom: 3px solid transparent;
        font-size: 18px;
    }
    .admin-tabs.mini li span.anchor,
    .admin-tabs.mini li a {
        border-bottom: 2px solid transparent;
        font-size: 16px;
    }
    .admin-tabs li.active span.anchor,
    .admin-tabs li.active a {
        border-bottom: 3px solid #4BC1D2;
    }
    .admin-tabs .badge {
        top: 12px;
    }
}
@media screen and (max-width: 39.9375em) {
    .admin-tabs.medium {
        margin-top: 0px;
        padding-bottom: 6px;
    }
    .admin-tabs li {
        margin-left: 15px;
    }
    .admin-tabs.medium li {
        margin-right: 20px;
        margin-left: 0px;
    }
    .admin-tabs.mini li span.anchor,
    .admin-tabs.mini li a {
        padding: 0px 0px 10px;
    }
    .admin-tabs li span.anchor,
    .admin-tabs li a {
        font-size: 18px;
    }
    .admin-tabs.medium li span.anchor,
    .admin-tabs.medium li a {
        font-size: 14px;
        padding: 10px 0px 7px;
    }
    .admin-tabs .badge {
        padding: 2px;
    }
}
@media screen and (max-width: 320px) {
    .admin-tabs li span.anchor,
    .admin-tabs li a {
        font-size: 15px;
    }
}

/* ALERTS */
.callout {
    border: none;
}
.callout.primary {
    border: 1px solid #c6dfe2;
    color: #566566;
    padding-left: 65px;
    background-image: url(/img/library/icons/icon-callout-primary.svg);
    background-repeat: no-repeat;
    background-position: left 20px center;
    background-size: 25px auto;
}
.dark .callout.primary {
    background-color: #001b20;
    border: 1px solid #0b3f4a;
}
.callout.secondary {
    background: #fffadd;
    border: 1px solid #f9ea95;
    color: #847b49;
    padding-left: 65px;
    background-image: url(/img/library/icons/icon-callout-secondary.svg);
    background-repeat: no-repeat;
    background-position: left 20px center;
    background-size: 25px auto;
}
.dark .callout.secondary {
    background-color: #282200;
    border: 1px solid #5e5939;
    color: #918752;
}
.dark .breadcrumbs li {
  color: #FFFFFF;
}
.breadcrumbs.as-tabs li:not(:last-child)::after {
  position: relative;
  margin: 0 0.75rem;
  opacity: 1;
  content: "|";
  color: #cacaca;
}

.noscroll {
  overflow: hidden !important;
}
/* TINY TABS */
.tiny-tabs {
    margin-bottom: 10px;
}
.tiny-tabs button {
    font-size: 14px;
    color: #666;
    border: 1px solid #dedede;
    padding: 8px 12px;
    cursor: pointer;
    border-radius: 5px;
    margin-right: 10px;
}
.tiny-tabs button:hover {
    color: #03151E;
    border: 1px solid #666;

}
.tiny-tabs button.active {
    background: #4BC1D2;
    border: 1px solid #4BC1D2;
    color: white;
}
.dark .tiny-tabs button {
    border: 1px solid #333;
    color: #8a8a8a;
}
.dark .tiny-tabs button:hover {
    color: #fff;
    border: 1px solid #505050;
}
.dark .tiny-tabs button.active {
    background: #0096B5;
    border: 1px solid #0096B5;
    color: #fff;
}
td.shrink {
    width: 0.1%;
    /* auto shrink hack */
}
/* GENERAL USE ICONS */

.more-info {
    display: block;
    background: url(/img/library/icons/icon-info.svg) no-repeat right 5px top 2px;
    background-size: 20px auto;
    position: relative;
    top: -10px;
    font-weight: normal;
    display: block;
    margin-top: 5px;
    /* color: white; */
    padding-right: 30px;
    color: #0096B5;
    font-size: 14px;

}
.more-info:hover {
    text-decoration: underline;
}
.more-info:focus {
    background-color: transparent;
}

/* CHOSEN */
body .chosen-container-single .chosen-single {
    border: 1px solid #dedede;
    background: #fff;
    height: 40px;
    line-height: 40px;
    box-shadow: inset 0 1px 2px rgb(10 10 10 / 10%);
}
body.dark .chosen-container-single .chosen-single {
    background: #131313;
    border: 1px solid #232323;
    color: #fff;
}
body .chosen-container-single .chosen-single div b {
    background-position: 2px 10px;
}
body .chosen-container-active.chosen-with-drop .chosen-single div b {
    background-position: -16px 10px;
}
body .chosen-container-multi .chosen-choices li.search-field input[type=text] {
    color: #666;
    padding-left: 5px;
}
body .chosen-container-active.chosen-with-drop .chosen-single {
    background: white;
    border: 1px solid #dedede;
}
body.dark .chosen-container-active.chosen-with-drop .chosen-single {
    background: #131313;
    border: 1px solid #232323;
    box-shadow: none;
}
body .chosen-container .chosen-results li.highlighted {
    background: #4BC1D2;
    border-radius: 2px;
}
body.dark .chosen-container .chosen-results li.highlighted {
    background: #0096B5;
}
body .chosen-container-single .chosen-search input[type=text] {
    border: 1px solid #dedede;
    border-radius: 4px;
    color: #666;
}
body.dark .chosen-container-single .chosen-search input[type=text] {
    border: 1px solid #232323;
    border-radius: 4px;
    color: #fff;
}
body .chosen-container .chosen-drop {
    border: 1px solid #dedede;
}
body.dark .chosen-container .chosen-drop {
    border: 1px solid #232323;
    background: #131313;
}
body.dark .chosen-container .chosen-results {
    color: #fff;
}
body.dark .chosen-container .chosen-results li.no-results {
    background: #131313;
    color: #8a8a8a;
}

/* TABLES */
table {
    /* border: 1px solid #efefef; */
    border: none;
}
.dark table {
    /* border: 1px solid #000; */
    border: none;
}
table thead {
    background-color: #f6f6f6;
    border-radius: 6px 6px 0px 0px;
    color: #8a8a8a;
}
.dark table thead {
    background-color: #282828;
    border-radius: 6px 6px 0px 0px;
}
table thead th:first-child {
    border-radius: 6px 0px 0px 0px;
}
table thead th:last-child {
    border-radius: 0px 6px 0px 0px;
}
thead th, thead td, tfoot th, tfoot td,
tbody td {
    padding: 10px;
}
#primary table.dataTable tbody th,
#primary table.dataTable tbody td {
    padding: 10px;
}
/* .padded thead th,
.padded thead td,
.padded tfoot th,
.padded tfoot td,
.padded tbody td {
    padding: 10px;
} */
thead {
    font-size: 12px;
    text-transform: uppercase;
}
thead, tbody, tfoot {
    background-color: #fff;
    /* border: 1px solid #efefef; */
    border: none;
}
.dark thead,
.dark tbody,
.dark tfoot {
    background-color: #1B1B1B;
    /* border: 1px solid #000; */
    border: none;
    color: #8a8a8a;
}
tbody tr {
    background-color: #fff;
    /* border-bottom: 1px solid #efefef; */
    border: none;
}
tbody tr:nth-child(even) {
    background-color: #fff;
    /* border-bottom: 1px solid #efefef; */
    border: none;
}
.dark tbody tr {
    background-color: #1b1b1b;
    /* border-bottom: 1px solid #000; */
    border: none;
}
.dark tbody tr:nth-child(even) {
    background-color: #1b1b1b;
    /* border-bottom: 1px solid #000; */
    border: none;
}
.dark table.dataTable tbody tr {
    background: #1b1b1b;
}
#current-managers tbody tr td:first-child {
    font-weight: bold;
}

/* FORMS */
legend, label.large-label {
    font-weight: bold;
    font-size: 24px;
    margin-top: 20px;
}
legend.top, label.large-label.top {
    margin-top: 0px;
}
label.large-label select:first-child,
label.large-label input:first-child {
    margin-top: 10px;
}
.help-text {
    line-height: 1.3rem;
    color: #333;
}
.alert-text {
    color: #DF6C5E;
    font-style: italic;
    line-height: 1.6rem;
    font-size: 18px;
    padding: 10px;
    border: 1px solid #EC7D78;
    border-radius: 6px;
}
label {
    color: #03151E;
    font-size: 15px;
    font-weight: 400;
}
@media screen and (max-width: 39.9375em) {
    #add-item-form [type='checkbox'] + label,
    #add-item-form [type='radio'] + label,
    #manual-entry-form [type='checkbox'] + label,
    #manual-entry-form [type='radio'] + label,
    #csv-import-form [type='checkbox'] + label,
    #csv-import-form [type='radio'] + label {
        margin-left: 0.2rem;
        margin-right: 0.8rem;
    }
}
select {
    border: 1px solid #dedede;
    box-shadow: inset 0 1px 2px rgb(10 10 10 / 10%);
}
select:focus {
    border: 1px solid #dedede;
    border-top: 1px solid #f6f6f6;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1), 0px 8px 16px -10px rgba(0,0,0,0.3);
    background-color: #f9f9f9;
}
.card-input-border {
  border: 1px solid #dedede;
  padding: 10px;
  border-radius: 4px;
}
.dark .card-input-border {
  border: 1px solid #232323;
  background-color: #131313;
}
[type='text'],
[type='password'],
[type='date'],
[type='datetime'],
[type='datetime-local'],
[type='month'],
[type='week'],
[type='email'],
[type='number'],
[type='search'],
[type='tel'],
[type='time'],
[type='url'],
[type='color'],
textarea,
{
    border: 1px solid #dedede;
    transition: all 0.2s ease-in-out;
    background-color: #fff;
}
[type='text']:focus,
[type='password']:focus,
[type='date']:focus,
[type='datetime']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='week']:focus,
[type='email']:focus,
[type='number']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='url']:focus,
[type='color']:focus,
textarea:focus {
    border: 1px solid #dedede;
    border-top: 1px solid #f6f6f6;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1), 0px 8px 16px -10px rgba(0,0,0,0.3);
    background-color: #f9f9f9;
}
textarea[name="description"],
textarea[name="notes"],
textarea[name="review"],
textarea#review {
    height: 200px;
}
.dark label {
    color: white;
}
.dark .help-text {
    color: #888;
}
.dark select,
.dark [type='text'],
.dark [type='password'],
.dark [type='date'],
.dark [type='datetime'],
.dark [type='datetime-local'],
.dark [type='month'],
.dark [type='week'],
.dark [type='email'],
.dark [type='number'],
.dark [type='search'],
.dark [type='tel'],
.dark [type='time'],
.dark [type='url'],
.dark [type='color'],
.dark textarea {
    border: 1px solid #232323;
    background-color: #131313;
    transition: all 0.2s ease-in-out;
    color: #fff;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.7);
}
.dark [type='text']:focus,
.dark [type='password']:focus,
.dark [type='date']:focus,
.dark [type='datetime']:focus,
.dark [type='datetime-local']:focus,
.dark [type='month']:focus,
.dark [type='week']:focus,
.dark [type='email']:focus,
.dark [type='number']:focus,
.dark [type='search']:focus,
.dark [type='tel']:focus,
.dark [type='time']:focus,
.dark [type='url']:focus,
.dark [type='color']:focus,
.dark textarea:focus {
    border: 1px solid #232323;
    border-top: 1px solid #131313;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.7), 0px 8px 16px -10px rgba(0,0,0,0.8);
    background-color: #101010;
}
.dark input:disabled,
.dark input[readonly],
.dark textarea:disabled,
.dark textarea[readonly] {
    background-color: #2D2D2D;
    color: #777777;
}
.dark .is-invalid-input:not(:focus) {
  border-color: #DF6C5E;
}
#cover-image-filename {
    font-size: 14px;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333;
}
label[for="theme-logo-upload"].button.muted,
label[for="cover-image"].button.muted {
    padding-left: 50px;
    background: url(/img/library/icons/icon-image-dark.svg) left 20px center no-repeat #e3eaec;
    background-size: 18px auto;
    color: #03151E;
}
label[for="cover-image"].button.muted {
    margin-top: 27px;
}
label[for="theme-logo-upload"].button.muted:hover,
label[for="cover-image"].button.muted:hover {
    background-color: #d2dde0;
}
.dark label[for="theme-logo-upload"].button.muted,
.dark label[for="cover-image"].button.muted {
    padding-left: 50px;
    background: url(/img/library/icons/icon-image-white.svg) left 20px center no-repeat #3A3B3C;
    background-size: 18px auto;
    color: #fff;
}
.darl label[for="theme-logo-upload"].button.muted:hover,
.dark label[for="cover-image"].button.muted:hover {
    background-color: #464748;
}
.button.muted {
    background-color: #e3eaec;
    color: #03151E;
}
.dark .button.muted {
    background-color: #3A3B3C;
    color: white;
}
.button.muted:hover {
    background-color: #d2dde0;
}
.dark .button.muted:hover {
    background-color: #464748;
}
.accordion {
    background: transparent;
}
ul.accordion li {
    margin-bottom: 5px;
}
.accordion-title {
    color: #03151E;
    font-size: 18px;
    font-weight: bold;
    border: 1px solid #dedede;
    border-radius: 4px !important;
    padding: 15px;
}
.dark .accordion-content {
    color: #ababab;
}
.accordion-item .accordion-content {
    border: 1px solid #dedede;
    border-top: none;
    border-radius: 0px 0px 4px 4px !important;
}

.accordion-item.disabled .accordion-content {
  display: none !important;
}
.accordion-item.disabled.is-active {
  border-bottom: 1px solid #dedede !important;
}
.dark .accordion-item.disabled.is-active {
  border-bottom: 1px solid #2d2d2d !important;
}

.dark .accordion-item .accordion-content {
    border: 1px solid #2d2d2d;
    border-top: none;
}
.dark .accordion-title {
    background: #1B1B1B;
    border: 1px solid #2d2d2d;
}
.dark .accordion-title {
    color: white;
}
.accordion-title:hover, .accordion-title:focus {
    background: #f6f6f6;
}
.dark .accordion-title:hover, .dark .accordion-title:focus {
    background: #131313;
}
.accordion-title::before {
    content: " ";
    background: url(/img/library/icons/icon-right-arrow-dark.svg) no-repeat center center;
    background-size: 10px auto;
    width: 20px;
    height: 20px;
    transition: all 0.1s ease-in-out;
    margin-top: -10px;
}
.dark .accordion-title::before {
    content: " ";
    background: url(/img/library/icons/icon-right-arrow-white.svg) no-repeat center center;
    background-size: 10px auto;
    width: 20px;
    height: 20px;
    transition: all 0.1s ease-in-out;
    margin-top: -10px;
}
.is-active > .accordion-title::before {
    transform: rotate(90deg);
    margin-top: -10px;
    content: " ";
}
.accordion-content {
    /* border: none; */
    padding: 1rem 15px;
    background: transparent;
}
ul.accordion.filter-accordion {
    border-radius: 0px;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #ececec;
}
.dark ul.accordion.filter-accordion {
    border-bottom: 1px solid #282828;
}
.manager-email {
    color: #0096B5;
    text-decoration: underline;
}
.settings .accordion-content {
    border: none !important;
}
:last-child:not(.is-active) > .accordion-title {
    border-bottom: 1px solid #dedede;
}
.dark :last-child:not(.is-active) > .accordion-title {
    border-bottom: 1px solid #2d2d2d;
}
.is-invalid-input:focus {
  border-color: #DF6C5E !important;
}
#current-managers select {
    margin-bottom: 0px;
}
#current-managers .chosen-container-multi .chosen-choices,
#publish_library_select_chosen.chosen-container-multi .chosen-choices,
.chosen-container.chosen-container-multi .chosen-choices {
    border: 1px solid #dedede;
    border-radius: 4px;
    padding: 5px;
    background: #fff;
    box-shadow: none;
}
.dark #current-managers .chosen-container-multi .chosen-choices,
.dark #publish_library_select_chosen.chosen-container-multi .chosen-choices,
.dark .chosen-container.chosen-container-multi .chosen-choices  {
    border: 1px solid #2d2d2d;
    background: #131313;
}
#current-managers .chosen-container-active.chosen-container-multi .chosen-choices,
#publish_library_select_chosen.chosen-container-active.chosen-container-multi .chosen-choices,
.chosen-container-active.chosen-container-multi .chosen-choices {
    border-radius: 4px 4px 0px 0px;
}
#current-managers .chosen-container .chosen-drop,
#publish_library_select_chosen.chosen-container .chosen-drop,
.chosen-container.chosen-container-multi .chosen-drop {
    border: 1px solid #dedede;
    border-top: 0px;
}
#current-managers .chosen-container .chosen-results li.highlighted,
#publish_library_select_chosen.chosen-container .chosen-results li.highlighted,
.chosen-container.chosen-container-multi .chosen-results li.highlighted {
    background: #4BC1D2;
}
#current-managers .chosen-container-multi .chosen-choices li.search-choice,
#publish_library_select_chosen.chosen-container-multi .chosen-choices li.search-choice,
.chosen-container.chosen-container-multi .chosen-choices li.search-choice {
    background: #efefef;
    border: 1px solid #dedede;
    color: #404040;
    font-weight: bold;
    margin: 1px 5px 1px 0;
    padding: 5px 20px 5px 5px;
}
.dark #current-managers .chosen-container-multi .chosen-choices li.search-choice,
.dark #publish_library_select_chosen.chosen-container-multi .chosen-choices li.search-choice,
.dark .chosen-container.chosen-container-multi .chosen-choices li.search-choice {
    background: #333;
    border: 1px solid #333;
    color: #fff;
    box-shadow: none;
}
.dark #current-managers .chosen-container .chosen-drop,
.dark #publish_library_select_chosen.chosen-container .chosen-drop,
.dark .chosen-container.chosen-container-multi .chosen-drop {
    background: #131313;
    border: 1px solid #2d2d2d;
}
#current-managers .chosen-container-multi .chosen-choices li.search-choice .search-choice-close,
#publish_library_select_chosen.chosen-container-multi .chosen-choices li.search-choice .search-choice-close,
.chosen-container.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    top: 6px;
}
#current-managers .button {
    margin-bottom: 0px;
}
#current-managers tr td:last-child {
    text-align: right;
}
.is-active > .accordion-title {
    border-bottom: none;
    border-radius: 4px 4px 0px 0px !important;
}
.dark .is-active > .accordion-title {
    border-bottom: none;
}
.settings .is-active > .accordion-title {
    border-bottom: 1px solid #dedede;
}
.dark .settings .is-active > .accordion-title {
    border-bottom: 1px solid #2d2d2d;
}
.dark .is-active > .accordion-title {
    border-bottom: none;
}
form#add-manager-form {
    max-width: 960px;
    margin: 0px auto;
}
@media only screen and (min-width: 1800px) {
    form#add-manager-form {
        margin: 0px 0px;
    }
}
#manager-count-wrap {
    padding: 15px;
    background: #f6f6f6;
    border-radius: 4px;
    margin-bottom: 15px;
}
.dark #manager-count-wrap {
    background: #131313;
    color: white;
}
.current-manager-count {
    font-size: 18px;
    font-weight: 400;
}
.current-manager-count span, .available-manager-count span {
    /* color: #df6c5e; */
    color: #03151E;
    font-weight: 900;
}
.dark .current-manager-count span, .dark .available-manager-count span {
    color: white;
}
.all-libraries {
    padding-left: 30px;
    background-image: url(/img/library/datatables/icon-libraries-dark.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 14px auto;
}

#current-managers .chosen-container.chosen-container-multi .chosen-choices,
.chosen-container.chosen-container-multi .chosen-choices {
    padding-left: 30px;
    background-image: url(/img/library/datatables/icon-libraries-dark.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 14px auto;
}
.chosen-container.chosen-container-multi .chosen-choices {
    background-image: none;
    padding-left: 5px;
}
#publish_library_select_chosen .chosen-container.chosen-container-multi .chosen-choices {
    padding-left: 5px;
    background-image: none;
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 14px auto;
}

/* CHOSEN GENERIC */
#notification-modal .chosen-container-single .chosen-single {
    height: 2.4375rem;
    margin: 10px 0px 0px;
    padding: 0.5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #dedede;
    background: #fefefe;
    font-size: 1rem;
    font-weight: normal;
    font-family: Roboto, sans-serif;
    line-height: 1.5;
    color: #03151E;
    padding-right: 1.5rem;
}
.dark #notification-modal .chosen-container-single .chosen-single {
    background: #131313;
    border: 1px solid #232323;
    color: white;
    box-shadow: none;
}
#notification-modal .chosen-container-single .chosen-single div b {
    background-position: 0px 10px;
}
#notification-modal .chosen-container-single .chosen-drop {
    border-color: #dedede;
}
.dark #notification-modal .chosen-container-single .chosen-drop {
    border-color: #232323;
    background: #131313;
}
#notification-modal .chosen-container-single .chosen-search {
    padding: 3px 6px;
}
#notification-modal .chosen-container-single .chosen-search input[type=text] {
    border-color: #dedede;
    border-radius: 4px;
}
.dark #notification-modal .chosen-container-single .chosen-search input[type=text] {
    border-color: #232323;
}
#notification-modal .chosen-container .chosen-results {
    margin-right: 6px;
    padding-left: 6px;
}
#notification-modal .chosen-container .chosen-results li.active-result {
    padding: 10px;
    font-size: 14px;
    color: #03151E;
}
.dark #notification-modal .chosen-container .chosen-results li.active-result {
    color: #fff;
}
#notification-modal .chosen-container .chosen-results li.active-result.highlighted {
    background: #efefef;
    border-radius: 4px;
}
.dark #notification-modal .chosen-container .chosen-results li.active-result.highlighted {
    background: #333;
}
#notification-modal .chosen-container .chosen-results li.active-result.result-selected {
    background: #4BC1D2;
    border-radius: 4px;
    color: white;
    font-weight: bold;
}
.dark #notification-modal .chosen-container .chosen-results li.active-result.result-selected {
    background: #4BC1D2;
}

/* END FORMS */

/* HELPERS */
.close {
    background: url(/img/library/icons/icon-close.svg) no-repeat;
    background-size: 25px 25px;
    height: 25px;
    width: 25px;
    position: absolute;
    right: 15px;
    top: 15px;
    cursor: pointer;
}
.close:hover {
    opacity: 0.7;
}
.dark .close {
    background: url(/img/library/icons/icon-close-white.svg) no-repeat;
    background-size: 25px 25px;
}
.item-flag-button {
    background: url(/img/library/icons/icon-flag-item.svg) no-repeat;
    background-size: 25px 25px;
    height: 25px;
    width: 25px;
    position: absolute;
    right: 62px;
    top: 15px;
    cursor: pointer;
}
.item-flag-button:hover {
    opacity: 0.7;
}
.dark .item-flag-button {
    background: url(/img/library/icons/icon-flag-item-white.svg) no-repeat;
    background-size: 25px 25px;
}
.close.close-filters,
#batch-edit-close.close,
.close.img-overlay-close,
.dark .close.close-filters,
.dark #batch-edit-close.close
.dark .close.img-ovelray-close {
    background-position: center center;
    background-size: 18px auto;
    height: 34px;
    width: 34px;
}
.margin-top-none {
    margin-top: 0;
}
.margin-top-10 {
    margin-top: 10px;
}
.margin-top-20 {
    margin-top: 20px;
}
.margin-top-30 {
    margin-top: 30px;
}
.margin-top-50 {
    margin-top: 50px;
}
.divider {
    margin-top: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #dedede;
    display: block;
    height: 1px;
    box-sizing: border-box;
    width: 100%;
}
.dark .divider {
    border-bottom: 1px solid #2d2d2d;
}
.docs {
    position: fixed;
    right: -420px;
    top: 0px;
    bottom: 0px;
    width: 100%;
    max-width: 420px;
    padding: 15px;
    background: white;
    box-shadow: -2px 0px 8px rgba(0,0,0,0.1);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    color: #404040;
    font-size: 14px;
    transition: all 0.2s ease-in-out;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.docs {
        top: 60px
    }
}
@media screen and (max-width: 39.9375em) {
    .docs {
        top: 60px
    }
}
.dark .docs {
    background: #282828;
    color: #ccc;
}
.docs.active {
    right: 0px;
    z-index: 1100;
}
.docs h4 {
    font-size: 32px;
    font-weight: bold;
    padding-left: 35px;
    background: url(/img/library/icons/icon-help.svg) no-repeat left center;
    background-size: 26px auto;
}
.docs strong {
    color: #03151E;
    font-size: 18px;
}
.dark .docs strong {
    color: white;
}
.docs p {
    font-size: 14px;
    line-height: 1.4em;
}
.docs-highlight {
    background: #f6f6f6;
    border-radius: 6px;
    padding: 10px;
    margin-right: 20px;
}
.dark .docs-highlight {
    background: #1b1b1b;
}
.docs-highlight strong {
    font-size: 14px;
}
/* END HELPERS */

/* CONTAINERS */
.page-sidebar {
    box-sizing: border-box;
    padding-left: 50px;
}
@media screen and (max-width: 63.9375em) {
    .page-sidebar {
        margin-top: 30px;
        padding-top: 30px;
        padding-left: 0px;
        border-top: 1px solid #dedede;
    }
    .dark .page-sidebar {
        border-top: 1px solid #282828;
    }
}
#left-sidebar {
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    width: 235px;
    background: #f6f6f6;
    overflow-y: auto;
    z-index: 1014;
}
.dark #left-sidebar {
    background: #282828;
}
/* SWITCH ACCOUNTS */
.switch-account {
  padding: 10px 20px;
  margin-bottom: 20px;
  border: 1px solid #dedede;
  border-radius: 8px;
  cursor: pointer;
  position: relative;
  padding-left: 80px;
}
.switch-account:before {
    content:"";
    height: 40px;
    width: 40px;
    border-radius: 100%;
    border: 1px solid #dedede;
    position: absolute;
    top: 50%;
    margin-top: -20px;
    left: 20px;
}
.dark .switch-account:before {
    content:"";
    height: 40px;
    width: 40px;
    border-radius: 100%;
    border: 1px solid #2d2d2d;
    position: absolute;
    top: 50%;
    margin-top: -20px;
    left: 20px;
}
.switch-org {
    font-weight: bold;
    font-size: 24px;
}
.dark .switch-account {
    border: 1px solid #2d2d2d;
}
  .switch-account:hover {
    background-color: #f6f6f6;
  }
  .dark .switch-account:hover {
      background-color: #131313;
  }


.switch-account:hover  {
    padding-left: 80px;
    background-image: url(/img/library/icons/icon-batch-select-blue.svg);
    background-repeat: no-repeat;
    background-position: 20px center;
    background-size: 40px auto;
    background-color: #F8FEFF;
    border: 1px solid #4BC1D2;
}
.dark .switch-account:hover {
    background-color: #282828;
    border: 1px solid #4BC1D2;
}

 .switch-account:hover  {
    padding-left: 80px;
    background-image: url(/img/library/icons/icon-batch-select-blue.svg);
    background-repeat: no-repeat;
    background-position: 20px center;
    background-size: 40px auto;
    background-color: #F8FEFF;
    border: 1px solid #4BC1D2;
  }

  .switch-account.active, .switch-account.active:hover  {
    padding-left: 80px;
    background-image: url(/img/library/icons/icon-batch-select-blue.svg);
    background-repeat: no-repeat;
    background-position: 20px center;
    background-size: 40px auto;
    background-color: #F8FEFF;
    border: 1px solid #4BC1D2;
  }
  .dark .switch-account.active, .dark .switch-account.active:hover {
      background-color: #282828;
      border: none;
  }
  .switch-account .button {
    margin-bottom: 0px;
  }
  .switch-account.disabled {
    cursor: not-allowed;
    opacity: 0.6;
  }
  button.detach-account {
      position: absolute;
      right: 20px;
      top: 50%;
      margin-top: -20px;
  }
  @media screen and (max-width: 39.9375em) {
	button.detach-account {
        position: relative;
        right: auto;
        top: auto;
        margin-top: 20px;
    }
}
/* END SWITCH ACCOUNTS */

/* USER PROFILE */
.fullscreen {
    position: absolute;
    right: 105px;
    top: 50px;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    text-align: center;
    background: url(/img/library/icons/icon-fullscreen-dark.svg) no-repeat top center;
    background-size: 18px auto;
    cursor: pointer;
    z-index: 1012;
    opacity: 0.3;
    transition: all 0.2s ease-in-out;
}
.fullscreen.open {
    background: url(/img/library/icons/icon-fullscreen-exit-dark.svg) no-repeat top center;
    background-size: 18px auto;
}
.dark .fullscreen {
    background: url(/img/library/icons/icon-fullscreen.svg) no-repeat top center;
    background-size: 18px auto;
}
.dark .fullscreen.open {
    background: url(/img/library/icons/icon-fullscreen-exit.svg) no-repeat top center;
    background-size: 18px auto;
}
.fullscreen:hover {
    opacity: 1;
    transform: scale(1.1);
}
#user-profile {
    margin-top: 36px;
    position: absolute;
    right: 50px;
    z-index: 1013;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}
#user-identification {
    float: left;
    font-weight: bold;
    font-size: 14px;
    max-width: 240px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #404040;
    padding: 3px 50px 17px 18px;
    margin-bottom: 0px;
    border-radius: 100px;
    border-right: none;
    margin-right: -35px;
    background: #f6f6f6;
    transition: all 0.3s ease-in-out;
    min-width: 140px;
}
#account-menu-label {
    position: absolute;
    font-size: 12px;
    left: 20px;
    bottom: 3px;
}
#account-menu-label.mobile-account-menu-label {
    left: 66px;
    bottom: 10px;
}
.dark #user-identification {
    color: #ccc;
    background: #282828;
}
#user-profile:hover #user-identification {
    padding-right: 60px;
}
#user-image {
    display: inline-block;
}
#user-image img {
    transition: all 0.3s ease-in-out;
}
#user-image img:hover, #user-image img:active {
    transform: scale(1.1);
}
#user-image img {
    height: 40px;
    width: 40px;
    border-radius: 100%;
}
#user-profile .corner-badge {
    position: absolute;
    top: -7px;
    left: auto;
    right: -5px;
    display: block;
    height: 20px;
    width: 20px;
    border-radius: 100px;
    background: #B95049;
    color: white;
    font-size: 10px;
    text-indent: 0px;
    font-weight: bold;
    text-align: center;
    padding-top: 2px;
    z-index: 1;
    box-shadow: -1px 2px 2px rgba(0,0,0,0.5);
}
#user-profile:hover #user-image img {
    transform: scale(1.1);
}
@media screen and (max-width: 63.9375em) {
	#user-profile {
        right: auto;
        position: relative;
        margin-top: 0px;
        margin-bottom: 15px;
        z-index: 1;
        padding: 10px 15px;
        border: 1px solid #ececec;
        border-radius: 6px;
        cursor: pointer;
    }
    .user-profile-arrow {
        background-image: url(/img/library/icons/icon-right-arrow-dark.svg);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 12px auto;
        height: 20px;
        width: 20px;
        position: absolute;
        right: 15px;
        top: 50%;
        margin-top: -10px;
        transition: all 0.2s ease-in-out;
    }
    #user-profile.active .user-profile-arrow {
        transform: rotate(-90deg);
    }
    .dark .user-profile-arrow {
        background-image: url(/img/library/icons/icon-right-arrow-white.svg);
        background-position: center center;
    }
    #user-profile:hover, #user-profile:active {
        background-color: #ececec;
    }
    #user-image {
        display: inline-block;
    }
    #user-email {
        display: inline-block;
        padding-left: 10px;
        width: calc(100% - 80px);
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        position: absolute;
        left: 55px;
        top: 10px;
    }
    #user-profile .corner-badge {
        right: -8px;
        top: -8px;
        left: auto;
    }
    .dark #user-profile {
        border: 1px solid #404040;
    }
    .dark #user-profile:hover, .dark #user-profile:active {
        background-color: #404040;
    }
}
.animate-display {
    position: fixed;
    top: -100%;
    left: 0px;
    right: 0px;
    background: #1b1b1b;
    width: 100%;
    height: 100%;
    z-index: 2000;
}
.animate-display.light {
    background: #f6f6f6;
}
.animate-display.dark {
    background: #111;
}
.animate-display.update {
    animation-name: update-display;
    animation-duration: 4s;
}
@keyframes update-display {
    0% {top: -100%}
    15% {top: 0%}
    85% {top: 0%}
    100% {top: -100%}
}
.sun, .moon {
    width: 400px;
    height: 400px;
    border-radius: 100%;
    background: #fff;
    top: calc(100% + 300px);
    left: 50%;
    margin-left: -200px;
    margin-top: -300px;
    position: fixed;
}
.moon {
    background: #282828;
}
.sun.go .display-icon,
.moon.go .display-icon {
    background: url(/img/library/icons/icon-sun.svg) no-repeat center center;
    background-size: 300px auto;
    opacity: 0.3;
    transform: scale(0);
    transition: 0.2s ease-in-out;
    animation-name: animate-icon;
    animation-duration: 2.5s;
    animation-delay: 1.5s;
    width: 400px;
    height: 400px;
}
.moon.go .display-icon {
    background: url(/img/library/icons/icon-moon.svg) no-repeat center center;
    background-size: 150px auto;
}
.sun.go, .moon.go {
    animation-name: animate-icon-wrap;
    animation-duration: 2s;
    animation-delay: 1s;
}
@keyframes animate-icon-wrap {
    0% {top: calc(100% + 300px);}
    25% {top: 50%;}
    75% {top: 50%;}
    100% {top: calc(100% + 300px);}
}
@keyframes animate-icon {
    0% {transform: scale(0)}
    10% {transform: scale(1)}
    99% {transform: scale(1)}
    100% {transform: scale(0)}
}

/* PROFILE MENU */
#profile-menu {
    display: none;
}
#profile-menu.open {
    position: absolute;
    right: 20px;
    height: auto;
    max-height: 795px;
    background-color: rgb(238 238 239 / 90%);
    -webkit-backdrop-filter: blur(20px) saturate(200%);
    backdrop-filter: blur(20px) saturate(200%);
    width: 320px;
    padding: 20px;
    z-index: 1012;
    border-radius: 6px;
    top: 15px;
    box-shadow: 0px 8px 16px -12px rgba(0,0,0,0.5);
    overflow-y: auto;
    display: block;
}
#mobile-profile-menu a[href="#"],
#profile-menu a[href="#"] {
  cursor: default;
}
.dark #profile-menu.open {
    background-color: rgb(40 40 40 / 90%);
    box-shadow: 0px 8px 16px -12px rgba(0,0,0,1);
}
@-moz-document url-prefix() {
    #profile-menu.open {
        background-color: #f6f6f6;
    }
    .dark #profile-menu.open {
        background-color: #282828;
    }
}
#mobile-profile-menu {
    position: fixed;
    top: 100%;
    transition: all 0.2s ease-in-out;
    background: #f6f6f6;
}
.dark #mobile-profile-menu {
    background: #282828;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	#mobile-profile-menu {
        width: 410px !important;
    }
}
#mobile-profile-menu.open {
    position: fixed;
    padding: 20px;
    top: 61px;
    z-index: 0;
    bottom: 0px;
    width: 100%;
}
#user-info {
    padding-bottom: 15px;
    border-bottom: 1px solid #dedede;
    margin-bottom: 5px;
}
.dark #user-info {
    border-bottom: 1px solid #404040;
}
#user-info .name {
    font-weight: bold;
    font-size: 18px;
    line-height: 1.2em;
    padding-right: 50px;
    margin-bottom: 1px;
}
#user-info .email {
    font-size: 14px;
    color: #666;
    padding-right: 50px;
}
@media screen and (max-width: 63.9375em) {
	#user-info .name {
        padding-right: 0px;
    }
    #user-info .email {
        padding-right: 0px;
    }
}
.dark #user-info .email {
    color: #8a8a8a;
}
#user-info .manager {
    font-size: 14px;
    text-transform: capitalize;
}
.profile-item {
    background-image: url(/img/library/icons/icon-right-arrow-dark.svg);
    background-position: right 15px center;
    background-repeat: no-repeat;
    background-size: 10px auto;
    padding: 10px;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    display: block;
    color: #03151E;
}
.dark .profile-item {
    color: white;
    background-image: url(/img/library/icons/icon-right-arrow-white.svg);
}
.profile-item:hover {
    background-color: rgba(0,0,0,0.05);
}
.dark .profile-item:hover {
    background-color: rgba(0,0,0,0.25);
}
#profile-menu-list .divider {
    margin: 5px 0px;
    padding: 0px;
    height: 1px;
}
.dark #profile-menu-list .divider {
    border-bottom: 1px solid #404040;
}
#profile-menu h4 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
}
#user-billing span {
    font-size: 12px;
    color: white;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 5px;
    display: inline-block;
    position: relative;
    top: -1px;
    margin-left: 5px;
}
.dark #user-billing span {
    color: #1b1b1b;
}
.pro-plan span {
    background: #4BC1D2;
}
.basic-plan span {
    background: #03151E;
}
#profile-menu-notifications {
    padding-top: 15px;
    border-top: 1px solid #dedede;
    margin-top: 5px;
}
.dark #profile-menu-notifications {
    border-top: 1px solid #404040;
}
a.profile-notification {
    font-size: 12px;
    padding: 10px;
    padding-left: 60px;
    min-height: 75px;
    display: block;
    color: #03151E;
    border-radius: 6px;
}
.dark a.profile-notification {
    color: white;
}
a.profile-notification:hover {
    background-color: rgba(0,0,0,0.05);
}
.dark a.profile-notification:hover {
    background-color: rgba(0,0,0,0.25);
}
.update.profile-notification {
    background: url(/img/library/notification-icons/update.svg) no-repeat left 8px center;
    background-size: 35px auto;
}
.announcement.profile-notification {
    background: url(/img/library/notification-icons/announcement.svg) no-repeat left 9px center;
    background-size: 35px auto;
}
.billing.profile-notification {
    background: url(/img/library/notification-icons/billing.svg) no-repeat left 4px center;
    background-size: 40px auto;
    background-color: #ffe4df;
}
.dark .billing.profile-notification {
  background-color: #421d1b;
}
.profile-notification h6 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 0px;
    padding-bottom: 0px;
}
.profile-notification div {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#primary {
    position: absolute;
    overflow-y: scroll;
    box-sizing: border-box;
    top: 0px;
    left: 235px;
    right: 0px;
    bottom: 0px;
    background: white;
    transition: all 0.2s ease-in-out;
}
.dark #primary {
    background: #1b1b1b;
}
#primary-inner {
    padding: 40px 50px;
}
@media screen and (max-width: 63.9375em) {
    #left-sidebar {
        display: none;
    }
    #primary {
        left: 0px;
        top: 61px;
    }
    #primary-inner {
        padding: 40px;
    }
    #inspector {
        left: 0px;
        width: auto;
    }
}
@media screen and (max-width: 39.9375em) {
    #primary {
        position: fixed;
    }
	#primary-inner {
        padding: 10px 20px;
    }
    #library-items {
        margin-left: -10px !important;
        margin-right: -10px !important;
    }
}

#library-header.fixed {
    height: 54px;
}
@media screen and (max-width: 39.9375em) {
	#library-header.fixed {
        height: auto;
    }
    .library-page-tpl #primary {
        position: fixed;
    }
}
#primary-search.fixed {
    position: fixed;
    top: 0px;
    background: white;
    left: 235px;
    padding: 20px 50px 0px;
    box-sizing: border-box;
    z-index: 1000;
    box-shadow: 0px 6px 16px -10px rgba(0,0,0,0.3);
    right: 0px;
    width: auto;
}
.filter-open #primary-search.fixed {
    right: 260px;
}
#primary-search.fixed #search-options {
    top: 65px;
}
.dark #primary-search.fixed {
    background: #1B1B1B;
    box-shadow: 0px 6px 16px -10px rgba(0,0,0,0.8);
}
@media screen and (max-width: 39.9375em) {
	#primary-search.fixed {
        position: relative;
        top: auto;
        background: transparent;
        left: auto;
        padding: inherit;
        box-sizing: border-box;
        z-index: auto;
        box-shadow: none;
        right: auto;
        width: 100%;
    }
}
#header-menu {
    margin-top: 0px;
}
#az-filter {
    min-height: 20px;
    padding-top: 20px;
    width: 100%;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	#az-filter {
        padding-top: 10px;
    }
}
#letter-range {
    left: 0px;
    width: 100%;
    padding-bottom: 0;
    text-align: center;
    font-size: 14px;
    color: #03151E;
    margin: auto;
}
.dark #letter-range {
    color: white;
}
#letter-range.fixed {
    position: fixed;
    left: 236px;
    top: 74px;
}
.letter {
    cursor: pointer;
    margin-left: 9px;
    margin-right: 9px;
    text-align: center;
    display: inline-block;
}
  .letter.active {
    font-weight: bold;
    color: #4BC1D2;
  }
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.letter {
        margin-left: 7px;
        margin-right: 7px;
    }
}
@media screen and (max-width: 39.9375em) {
    .letter {
        margin-left: 7px;
        margin-right: 6px;
    }
}
.letter:hover {
    opacity: 0.7;
}

/* LEFT SIDEBAR */
#logo {
    background: url(/img/public/libib_logo_dark_blue.svg) no-repeat right bottom 7px;
    height: auto;
    width: auto;
    background-size: auto 19px;
    display: block;
    width: 122px;
    font-family: 'Open Sans', sans-serif;
    font-size: 2.4rem;
    line-height: 1em;
    font-weight: 300;
    color: #03151E;
    padding: 0px;
    margin: 40px 0px 20px 35px;
}
.dark #logo {
    background: url(/img/public/libib_logo_white.svg) no-repeat right bottom 7px;
    background-size: auto 19px;
    color: white;
}
ul#primary-menu li {
    display: block;
    width: 100%;
}
ul#primary-menu li a {
    color: #03151e;
    font-size: 1rem;
    font-weight: 400;
    padding: 12px 35px 12px 35px;
    display: block;
    width: 100%;
    box-sizing: border-box;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-position: left -30px center;
}
.dark ul#primary-menu li a {
    color: white;
}
ul#primary-menu li a:hover, ul#primary-menu li a.active {
    text-indent: 35px;
}
ul#primary-menu li a:focus {
    outline: none;
    background-color: rgba(0,0,0,0.05);
}
:focus {
    outline: none;
}

li#libraries-link a:hover, li#libraries-link a.active {
    background: url(/img/library/icons/icon-libraries.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
    /* position: relative; */
}
/* li#libraries-link a:hover:after, li#libraries-link a.active:after {
content: '';
    position: absolute  ;
    right: 0px;
    top: 0px;
    width: 15px;
    height: 15px ;
    border-bottom: 15px solid transparent;
    border-right: 15px solid #fff;
    border-top: 15px solid transparent;
    clear: both;
} */
li#add-item-link a:hover, li#add-item-link a.active {
    background: url(/img/library/icons/icon-add-item.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
}
li#add-library-link a:hover, li#add-library-link a.active {
    background: url(/img/library/icons/icon-add-library.svg) no-repeat left 40px center #fff;
    background-size: 25px auto;
}
li#publish-link a:hover, li#publish-link a.active {
    background: url(/img/library/icons/icon-publish.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
}
li#lending-link a:hover, li#lending-link a.active {
    background: url(/img/library/icons/icon-lending.svg) no-repeat left 40px center #fff;
    background-size: 18px auto;
}
li#managers-link a:hover, li#managers-link a.active {
    background: url(/img/library/icons/icon-managers.svg) no-repeat left 36px center #fff;
    background-size: 24px auto;
}
li#barcodes-link a:hover, li#barcodes-link a.active {
    background: url(/img/library/icons/icon-barcodes.svg) no-repeat left 30px center #fff;
    background-size: 32px auto;
}
li#dashboards-link a:hover, li#dashboards-link a.active {
    background: url(/img/library/icons/icon-dashboards.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
}
li#reports-link a:hover, li#reports-link a.active {
    background: url(/img/library/icons/icon-reports.svg) no-repeat left 40px center #fff;
    background-size: 15px auto;
}
li#settings-link a:hover, li#settings-link a.active {
    background: url(/img/library/icons/icon-settings.svg) no-repeat left 40px center #fff;
    background-size: 18px auto;
}
li#support-link a:hover {
    background: url(/img/library/icons/icon-support.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
}
li#logout-link a:hover {
    background: url(/img/library/icons/icon-logout.svg) no-repeat left 40px center #fff;
    background-size: 20px auto;
}
/* Dark Menu */
.dark li#libraries-link a:hover, .dark li#libraries-link a.active {
    background: url(/img/library/icons/icon-libraries.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.dark li#add-item-link a:hover, .dark li#add-item-link a.active {
    background: url(/img/library/icons/icon-add-item.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.dark li#add-library-link a:hover, .dark li#add-library-link a.active {
    background: url(/img/library/icons/icon-add-library.svg) no-repeat left 40px center #1b1b1b;
    background-size: 25px auto;
}
.dark li#publish-link a:hover, .dark li#publish-link a.active {
    background: url(/img/library/icons/icon-publish.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.dark li#lending-link a:hover, .dark li#lending-link a.active {
    background: url(/img/library/icons/icon-lending.svg) no-repeat left 40px center #1b1b1b;
    background-size: 18px auto;
}
.dark li#managers-link a:hover, .dark li#managers-link a.active {
    background: url(/img/library/icons/icon-managers.svg) no-repeat left 36px center #1b1b1b;
    background-size: 24px auto;
}
.dark li#barcodes-link a:hover, .dark li#barcodes-link a.active {
    background: url(/img/library/icons/icon-barcodes.svg) no-repeat left 30px center #1b1b1b;
    background-size: 32px auto;
}
.dark li#dashboards-link a:hover, .dark li#dashboards-link a.active {
    background: url(/img/library/icons/icon-dashboards.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.dark li#reports-link a:hover, .dark li#reports-link a.active {
    background: url(/img/library/icons/icon-reports.svg) no-repeat left 40px center #1b1b1b;
    background-size: 15px auto;
}
.dark li#settings-link a:hover, .dark li#settings-link a.active {
    background: url(/img/library/icons/icon-settings.svg) no-repeat left 40px center #1b1b1b;
    background-size: 18px auto;
}
.dark li#support-link a:hover {
    background: url(/img/library/icons/icon-support.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.dark li#logout-link a:hover {
    background: url(/img/library/icons/icon-logout.svg) no-repeat left 40px center #1b1b1b;
    background-size: 20px auto;
}
.menu-spacer {
    height: 70px;
    display: block;
}
#s-spacer {
    height: 155px;
    display: block;
    width: 100%;
    position: relative;
}
.trial-time {
  font-size: 13px;
  font-weight: bold;
  color: #DF6C5E;
  margin-bottom: 5px;
}

/* SOCIAL MENU */
#s-menu {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 235px;
    padding: 20px;
    background: #f6f6f6;
    box-sizing: border-box;
}
.dark #s-menu {
    background: #282828;
}
#s-menu ul {
    text-indent: -999999px;
}
#s-menu ul li {
    width: 25%;
}
.s-link {
    height: 40px;
    width: 32px;
}
.s-link:hover {
    opacity: 0.7;
}
#postnews-link {
    background: url(/img/library/icons/postnews.png) no-repeat center center;
    background-size: 25px auto;
}
#bluesky-link {
    background: url(/img/library/icons/bluesky.svg) no-repeat center center;
    background-size: 26px auto;
}
#fb-link {
  background: url(/img/library/icons/facebook.svg) no-repeat center center;
  background-size: 25px auto;
}
#insta-link {
    background: url(/img/library/icons/instagram.svg) no-repeat left 15px center;
    background-size: 25px auto;
}
#youtube-link {
    background: url(/img/library/icons/youtube.svg) no-repeat center center;
    background-size: 32px auto;
}
#tiktok-link {
    background: url(/img/library/icons/tiktok.svg) no-repeat center center;
    background-size: 20px auto;
}

/* MOBILE MENU */
#mobile-logo {
    text-indent: -99999px;
    display: block;
    height: 40px;
    width: 60px;
    background: url(/img/public/libib_logo_dark_blue.svg) no-repeat center center;
    background-size: 40px auto;
}
.dark #mobile-logo {
    background: url(/img/public/libib_logo_white.svg) no-repeat center center;
    background-size: 40px auto;
}
#navbar {
    padding: 10px 0px;
    border-bottom: none;
    box-shadow: 0px 2px 8px rgba(0,0,0,0.1);
}
.dark #navbar {
    background: #282828;
}
#mobile-menu {
    margin-right: 10px;
}
.navbar-spacer {
    height: 61px;
    position: relative;
    width: 100%;
}
#mobile-overlay {
    position: fixed;
    top: 0px;
    left: -100%;
    width: 100%;
    bottom: 0px;
    background: rgba(0,0,0,0.3);
    z-index: 1;
    opacity: 0;
    -webkit-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}
#mobile-overlay.transition {
    left: 0;
}
#mobile-overlay.show-menu {
    display: block;
    left: 0;
    opacity: 1;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .navbar-spacer {
        height: 61px;
    }
    #left-sidebar {
        display: block;
        left: -100%;
        z-index: 2;
        top: 60px;
        width: 410px;
        box-shadow: 2px 0px 8px rgba(0,0,0,0.1);
        -webkit-overflow-scrolling: touch;
    }
    #left-sidebar.transition {
        -webkit-transition: left 0.3s ease-in-out;
        -o-transition: left 0.3s ease-in-out;
        transition: left 0.3s ease-in-out;
    }
    #left-sidebar #logo {
        display: none;
    }
    #left-sidebar.show-menu {
        left: 0px;
        /* display: block; */
        z-index: 1014;
    }
    #s-menu {
        left: -100%;
        width: 410px;
        z-index: 1;
        /* -webkit-transition: left 0.3s ease-in-out;
        -o-transition: left 0.3s ease-in-out;
        transition: left 0.3s ease-in-out;
        width: 50%; */
    }
    #left-sidebar.transition #s-menu {
        -webkit-transition: left 0.3s ease-in-out;
        -o-transition: left 0.3s ease-in-out;
        transition: left 0.3s ease-in-out;
    }
    #left-sidebar.show-menu #s-menu {
        left: 0;
        /* display: block; */
    }
    #left-sidebar ul#primary-menu li a:hover,
    #left-sidebar ul#primary-menu li a:active {
        text-indent: 0px !important;
        background-color: white;
        background-image: none;
    }
    .dark #left-sidebar ul#primary-menu li a:hover,
    .dark #left-sidebar ul#primary-menu li a:active {
        text-indent: 0px !important;
        background-color: #1b1b1b;
        background-image: none;
    }
}
@media screen and (max-width: 39.9375em) {
    #mobile-overlay.show-menu {
        display: none !important;
    }
    #navbar {
        padding: 10px 0px;
    }
    .navbar-spacer {
        height: 61px;
    }
    #left-sidebar {
        display: block;
        top: 100%;
        z-index: 2;
        box-shadow: 2px 0px 8px rgba(0,0,0,0.1);
        left: 0px;
        width: 100%;
        z-index: 1020;
        position: fixed;
    }
    #left-sidebar #logo {
        display: none;
    }
    #left-sidebar.transition {
        -webkit-transition: top 0.3s ease-in-out;
        -o-transition: top 0.3s ease-in-out;
        transition: top 0.3s ease-in-out;
    }
    #left-sidebar.show-menu {
        top: 60px;
        z-index: 1020;
    }
    ul#primary-menu li a {
        font-size: 1.8rem;
    }
    #left-sidebar ul#primary-menu li a:hover,
    #left-sidebar ul#primary-menu li a:active {
        text-indent: 0px !important;
        background-color: white;
        background-image: none;
    }
    .dark #left-sidebar ul#primary-menu li a:hover,
    .dark #left-sidebar ul#primary-menu li a:active {
        text-indent: 0px !important;
        background-color: #1b1b1b;
        background-image: none;
    }
    ul#primary-menu li a.active {
        text-indent: 45px;
        background-image: auto;
    }
    li#libraries-link a:hover, li#libraries-link a.active {
        background-size: 28px auto;
    }
    li#add-item-link a:hover, li#add-item-link a.active {
        background-size: 28px auto;
    }
    li#add-library-link a:hover, li#add-library-link a.active {
        background-size: 33px auto;
    }
    li#publish-link a:hover, li#publish-link a.active {
        background-size: 28px auto;
    }
    li#lending-link a:hover, li#lending-link a.active {
        background-size: 26px auto;
    }
    li#managers-link a:hover, li#managers-link a.active {
        background-size: 32px auto;
    }
    li#barcodes-link a:hover, li#barcodes-link a.active {
        background-size: 40px auto;
    }
    li#dashboards-link a:hover, li#dashboards-link a.active {
        background-size: 28px auto;
    }
    li#reports-link a:hover, li#reports-link a.active {
        background-size: 23px auto;
    }
    li#settings-link a:hover, li#settings-link a.active {
        background-size: 26px auto;
    }
    li#support-link a:hover {
        background-size: 28px auto;
    }
    li#logout-link a:hover {
        background-size: 28px auto;
    }
    #left-sidebar ul#primary-menu li a.active:hover,
    #left-sidebar ul#primary-menu li a.active:active {
        text-indent: 45px;
    }
    #s-menu {
        bottom: -100%;
        width: 100%;
        padding-bottom: 10px;
        box-shadow: -2px 4px 8px rgba(0,0,0,0.3);
        z-index: 1;
    }
    #s-spacer {
        height: 175px;
        display: block;
        width: 100%;
        position: relative;
    }
    #left-sidebar.transition #s-menu {
        -webkit-transition: bottom 0.3s ease-in-out;
        -o-transition: bottom 0.3s ease-in-out;
        transition: bottom 0.3s ease-in-out;
    }
    #left-sidebar.show-menu #s-menu {
        bottom: 0;
    }
}


/* LIBRARY PAGE */
#library-header {
    position: relative;
    z-index: 1011;
}
.jump-edit .loading-icon, .jump-edit .jump-cover {
    border-radius: 15px;
}
.jump-edit {
    position: fixed;
    background-color: #FFF;
    width: 600px;
    margin-top: 20vh;
    left: calc(50% - 300px);
    z-index: 2050;
    /* Higher than overlay, less than notifications  */
    border-radius: 15px;
    box-shadow: 0 4px 10px rgb(0 0 0 / 30%);
}
.dark .jump-edit {
    background-color: #1b1b1b;
    color: #fff;
    box-shadow: 0 4px 10px rgb(0 0 0 / 70%);
}
@media screen and (max-width: 39.9375em) {
    .jump-edit {
        left: 5px;
        right: 5px;
        width: calc(100% - 10px);
        margin-top: 0px;
    }
}
div.jump-title {
    color: #666;
    padding: 5px 20px;
    text-align: center;
    border-top: 1px solid #dedede;
    position: absolute;
    bottom: 0px;
    width: 100%;
    border-radius: 0px 0px 15px 15px;
    background: white;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.dark div.jump-title {
    background: #131313;
    border-top: 1px solid #131313;
    color: #fff;
}
span.jump-close {
    position: absolute;
    right: 20px;
    top: 16px;
    background: url(/img/library/icons/icon-close.svg) no-repeat center center #fff;
    background-size: 15px 15px;
    height: 30px;
    width: 30px;
    cursor: pointer;
    border: 2px solid #efefef;
    border-radius: 100px;
    text-indent: -9999px;
}
span.jump-close.disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
span.jump-close:hover {
    opacity: 0.7;
}
.dark span.jump-close {
    background: url(/img/library/icons/icon-close-white.svg) no-repeat center center #1b1b1b;
    border: 1px solid #404040;
    background-size: 15px 15px;
}
span.jump-close:after {
    content: "[ESC]";
    color: #666;
    position: absolute;
    right: 28px;
    top: 6px;
    font-size: 10px;
    width: 30px;
    height: 20px;
    text-indent: 0px;
}
.dark span.jump-close:after {
    content: "[ESC]";
    color: #8a8a8a;
}
.jump-cover span.jump-close:after {
    display: none;
}
.quick-edit-link {
    text-indent: -99999px;
    height: 40px;
    width: 40px;
    border: 2px solid #efefef;
    background-color: #fff;
    background-image: url(/img/library/icons/icon-edit.svg);
    background-size: 20px auto;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 100px;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}
.dark .quick-edit-link {
    background-image: url(/img/library/icons/icon-edit-white.svg);
    background-size: 20px auto;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #1b1b1b;
    border: 1px solid #404040;
}
.quick-edit-link:hover {
    opacity: 0.7;
    background-color: #f6f6f6;
}
.dark .quick-edit-link:hover {
    background-color: #131313;
    border: 1px solid #404040;
}

.item.summary .quick-edit-link {
    position: absolute;
    right: 20px;
    top: 20px;
}
.item.list .quick-edit-link {
    position: absolute;
    right: 0px;
    top: 25px;
}
.item.cover .quick-edit-link {
    position: absolute;
    top: 5px;
    right: 5px;
    height: 24px;
    width: 24px;
    background-size: 14px auto;
    border: none;
    opacity: 0;
}
.dark .item.cover .quick-edit-link {
    background-image: url(/img/library/icons/icon-edit.svg);
    background-size: 14px auto;
    background-color: #fff;
    border: none;
}
.item.cover:hover .quick-edit-link {
    opacity: 1;
}
.item.cover .quick-edit-link:hover {
    opacity: 0.7;
}
@media screen and (max-width: 39.9375em) {
	.quick-edit-link {
        width: 30px;
        height: 30px;
        background-size: 15px;
    }
    .item.summary .quick-edit-link {
        top: 10px;
        right: 10px;
    }
    .item.list .quick-edit-link {
        top: -5px;
    }
}

.jump-edit .jump-input-wrapper input[type="text"] {
    border: none;
    box-shadow: none;
    padding: 20px;
    border-bottom: 1px solid #efefef;
    border-radius: 15px 15px 0px 0px;
    font-size: 22px;
    height: 64px;
    line-height: 64px;
    margin-bottom: 0px;
}
.dark .jump-edit .jump-input-wrapper input[type="text"] {
    border-bottom: 1px solid #282828;
}
.jump-edit .scroll {
    height: 340px;
    overflow-y: scroll;
    padding: 0px 20px;
    margin-bottom: 35px;
    padding-bottom: 10px;
    padding-top: 10px;
}
.jump-edit ul {
    list-style: none;
    margin: 0;
}
  .jump-edit .scroll ul li {
    cursor: pointer;
    padding: 10px;
    padding-left: 40px;
    border-radius: 5px;
    margin-right: 0px;
    font-size: 17px;
    background-repeat: no-repeat;
    background-position: left 11px center;
    background-image: url(/img/library/icons/icon-fields-dark.svg);
    background-size: 16px auto;
    position: relative;
  }
  .dark .jump-edit .scroll ul li {
    background-image: url(/img/library/icons/icon-fields-white.svg);
    background-size: 16px auto;

  }

  .jump-edit .scroll ul li:hover,
  .jump-edit .scroll ul li.active {
    background-color: #f6f6f6;
  }
  .dark .jump-edit .scroll ul li:hover,
  .dark .jump-edit .scroll ul li.active {
    background-color: #282828;
  }
  .jump-edit .loading-icon,
  .jump-edit .jump-cover {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    background-color: #FFF;
  }
  .dark .jump-edit .loading-icon,
  .dark .jump-edit .jump-cover {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    background-color: #1b1b1b;
  }
  .jump-edit .jump-save-wrapper {
    position: absolute;
    bottom: 40px;
  }
  .jump-edit .scroll li[data-key="added"],
  .jump-edit .scroll li[data-key="publish_date"] {
    background-image: url(/img/library/icons/icon-calendar-dark.svg);
    background-size: 18px auto;
    background-position: left 10px top 14px;
  }
  .dark .jump-edit .scroll li[data-key="added"],
  .dark .jump-edit .scroll li[data-key="publish_date"] {
    background-image: url(/img/library/icons/icon-calendar-white.svg);
    background-size: 18px auto;
    background-position: left 10px top 14px;
  }
  .jump-edit .scroll li[data-key="creators"] {
    background-image: url(/img/library/icons/icon-account-dark2.svg);
    background-size: 18px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="creators"] {
    background-image: url(/img/library/icons/icon-account-white2.svg);
    background-size: 18px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="call_number"],
  .jump-edit .scroll li[data-key="ddc"],
  .jump-edit .scroll li[data-key="lcc"],
  .jump-edit .scroll li[data-key="lccn"],
  .jump-edit .scroll li[data-key="oclc"],
  .jump-edit .scroll li[data-key="lexile"] {
    background-image: url(/img/library/icons/icon-catalog-dark.svg);
    background-size: 22px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="call_number"],
  .dark .jump-edit .scroll li[data-key="ddc"],
  .dark .jump-edit .scroll li[data-key="lcc"],
  .dark .jump-edit .scroll li[data-key="lccn"],
  .dark .jump-edit .scroll li[data-key="oclc"],
  .dark .jump-edit .scroll li[data-key="lexile"] {
    background-image: url(/img/library/icons/icon-catalog-white.svg);
    background-size: 22px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="description"],
  .jump-edit .scroll li[data-key="upc_isbn10"],
  .jump-edit .scroll li[data-key="ean_isbn13"],
  .jump-edit .scroll li[data-key="length_of"],
  .jump-edit .scroll li[data-key="publisher"],
  .jump-edit .scroll li[data-key="title"] {
    background-image: url(/img/library/icons/icon-edit.svg);
    background-size: 20px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="description"],
  .dark .jump-edit .scroll li[data-key="upc_isbn10"],
  .dark .jump-edit .scroll li[data-key="ean_isbn13"],
  .dark .jump-edit .scroll li[data-key="length_of"],
  .dark .jump-edit .scroll li[data-key="publisher"],
  .dark .jump-edit .scroll li[data-key="title"] {
    background-image: url(/img/library/icons/icon-edit-white.svg);
    background-size: 20px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="price"] {
    background-image: url(/img/library/icons/icon-coin.svg);
    background-size: 18px auto;
    background-position: left 11px center;
  }
  .dark .jump-edit .scroll li[data-key="price"] {
    background-image: url(/img/library/icons/icon-coin-white.svg);
    background-size: 18px auto;
    background-position: left 11px center;
  }
  .jump-edit .scroll li[data-key="group"] {
    background-image: url(/img/library/icons/icon-group-dark.svg);
    background-size: 20px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="group"] {
    background-image: url(/img/library/icons/icon-group-white.svg);
    background-size: 20px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="tags"] {
    background-image: url(/img/library/icons/icon-tag-dark.svg);
    background-size: 18px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="tags"] {
    background-image: url(/img/library/icons/icon-tag-white.svg);
    background-size: 20px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="notes"] {
    background-image: url(/img/library/icons/icon-notes-dark.svg);
    background-size: 18px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="notes"] {
    background-image: url(/img/library/icons/icon-notes-white.svg);
    background-size: 18px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="rating"] {
    background-image: url(/img/library/icons/icon-rating2-dark.svg);
    background-size: 23px auto;
    background-position: left 9px center;
  }
  .dark .jump-edit .scroll li[data-key="rating"] {
    background-image: url(/img/library/icons/icon-rating2-white.svg);
    background-size: 23px auto;
    background-position: left 9px center;
  }
  .jump-edit .scroll li[data-key="review"] {
    background-image: url(/img/library/icons/icon-review-dark.svg);
    background-size: 21px auto;
    background-position: left 10px center;
  }
  .dark .jump-edit .scroll li[data-key="review"] {
    background-image: url(/img/library/icons/icon-review-white.svg);
    background-size: 21px auto;
    background-position: left 10px center;
  }
  .jump-edit .scroll li[data-key="status"] {
    background-image: url(/img/library/icons/icon-status2-dark.svg);
    background-size: 18px auto;
    background-position: left 11px center;
  }
  .dark .jump-edit .scroll li[data-key="status"] {
    background-image: url(/img/library/icons/icon-status2-white.svg);
    background-size: 18px auto;
    background-position: left 11px center;
  }
  .jump-edit .scroll ul li:hover:after,
  .jump-edit .scroll ul li.active:after {
    content: "";
    background: url(/img/library/icons/icon-enter-dark.svg) no-repeat center center;
    background-size: 20px auto;
    font-size: 12px;
    right: 20px;
    top: 10px;
    position: absolute;
    width: 25px;
    height: 25px;
    opacity: 0.5;
}
.dark .jump-edit .scroll ul li:hover:after,
.dark .jump-edit .scroll ul li.active:after {
  content: "";
  background: url(/img/library/icons/icon-enter-white.svg) no-repeat center center;
  background-size: 20px auto;
  font-size: 12px;
  right: 20px;
  top: 10px;
  position: absolute;
  width: 25px;
  height: 25px;
  opacity: 0.5;
}
.jump-input-name {
    font-size: 24px;
    font-weight: bold;
    padding: 20px;
}
#quick-edit-form {
    padding: 0px 20px;
}
#quick-edit-form input[type="text"] {
    height: 50px;
    padding: 20px;
}
#quick-edit-form .began input[type="text"],
#quick-edit-form .completed input[type="text"] {
  width: 32%;
  display: inline-block;
  height: 42px;
  margin-bottom: 10px;
}
#quick-edit-form textarea {
    padding: 20px;
}
#quick-edit-form select {
    height: 50px;
    padding-left: 20px;
    padding-right: 40px;
}
#jump-cover-save {
    margin-right: 10px;
}
.jump-data .group-autocomplete-suggestions, .jump-data .tag-autocomplete-suggestions {
    left: 20px;
    right: 20px;
}

@media screen and (max-width: 39.9375em) {
	#search-pane {
        height: 46px;
    }
    #library-header {
        margin-top: 8px;
        margin-bottom: 5px;
    }
}
#primary-search {
    position: relative;
    width: 100%;
}
#post-link {
    height: 30px;
    width: 30px;
    background: url(/img/library/icons/icon-post.svg) no-repeat center center;
    background-size: 30px auto;
}
.dark #post-link {
    background: url(/img/library/icons/icon-post-white.svg) no-repeat center center;
    background-size: 30px auto;
}
.admin-box {
  display: block;
  position: fixed;
  bottom: 0px;
  right: 20px;
  min-width: 270px;
  height: auto;
  border-radius: 8px 8px 0px 0px;
  background-color: #FFF;
  box-shadow: 0px 0px 10px #dadada;
}
  .dark .admin-box {
    background-color: #282828;
    box-shadow: 0px 0px 10px #000;
  }
  .admin-box .admin-box-title {
    padding-left: 15px;
    padding-right: 10px;
    padding-top: 7px;
    padding-bottom: 5px;
    background-color: #0096b5;
    color: #FFF;
    text-transform: uppercase;
    border-radius: 8px 8px 0px 0px;
    font-weight: bold;
  }
  .admin-box .admin-box-input-wrapper {
    padding: 10px;
  }


#notifications-link {
    height: 30px;
    width: 30px;
    background: url(/img/library/icons/icon-bell.svg) no-repeat center center;
    background-size: 26px auto;
    margin-left: 10px;
}
.dark #notifications-link {
    background: url(/img/library/icons/icon-bell-white.svg) no-repeat center center;
    background-size: 26px auto;
}
.corner-badge:empty {
    display: none;
}
.corner-badge {
    position: absolute;
    top: -6px;
    left: 32px;
    display: block;
    height: 20px;
    width: 20px;
    border-radius: 100px;
    background: #B95049;
    color: white;
    font-size: 10px;
    text-indent: 0px;
    font-weight: bold;
    text-align: center;
    padding-top: 5px;
}
#view-filters .corner-badge {
    left: auto;
    right: -6px;
}
#account-link {
    height: 30px;
    width: 30px;
    background: url(/img/library/icons/icon-account.svg) no-repeat center center;
    background-size: 36px auto;
    margin-left: 10px;
}
.dark #account-link {
    background: url(/img/library/icons/icon-account-white.svg) no-repeat center center;
    background-size: 36px auto;
}
.catalog-info {
  display: inline-block;
}
.meta strong {
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.meta.allow-copy strong {
    -moz-user-select: all;
    -webkit-user-select: all;
    user-select: all;
}

#header-menu a:hover {
    opacity: 0.7;
}
@media screen and (max-width: 39.9375em) {
    #header-menu {
        margin-bottom: 15px;
    }
    #account-link,
    #notifications-link,
    #post-link {
        margin-left: 0px;
    }
    ul#s-sites {
        display: none;
    }
}
#search {
    border: none;
    height: auto;
    box-shadow: none;
    outline: none;
    font-size: 1.6rem;
    line-height: 1rem;
    padding-left: 50px;
    background: url(/img/library/icons/icon-search.svg) no-repeat left 4px;
    background-size: 25px auto;
    padding-top: 0px;
    opacity: 1;
    transition: all 0.2s ease-in-out;
    width: calc(100% - 274px);
}
#search[disabled] {
    opacity: 0.4;
  }
  #search.search-blue {
    background: url(/img/library/icons/icon-search-blue.svg) no-repeat left 4px !important;
    background-size: 25px auto !important;
  }

.dark #search {
    background: url(/img/library/icons/icon-search-white.svg) no-repeat left 4px;
    background-size: 25px auto;
    color: white;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    #primary-search {
        /* margin-bottom: 10px; */
        margin-top: -20px;
    }
    #primary-search.fixed {
        left: 0px;
        top: 55px;
        padding-top: 0px;
        padding-left: 40px;
        padding-right: 40px;
        margin-top: 0px;
    }
    #search {
        padding-bottom: 0px;
        margin-bottom: 0px;
        height: 80px;
        background: url(/img/library/icons/icon-search.svg) no-repeat left center;
        background-size: 25px auto;
    }
    #search.search-blue {
        background: url(/img/library/icons/icon-search-blue.svg) no-repeat left center !important;
        background-size: 25px auto !important;
    }
    .dark #search {
        background: url(/img/library/icons/icon-search-white.svg) no-repeat left center;
        background-size: 25px auto;
    }

}
@media screen and (max-width: 63.9375em) {
	#search {
        width: 100%;
    }
}

/*
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    @supports (-webkit-touch-callout: none) {
        #search.search-blue {
            background: url(/img/library/icons/icon-search-blue.svg) no-repeat left center !important;
            background-size: 25px auto !important;
            line-height: 32px;
        }
    }
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
    #logo {
        margin: 30px 0px 10px 35px;
    }
    @supports (-webkit-touch-callout: none) {
        #search.search-blue {
            background: url(/img/library/icons/icon-search-blue.svg) no-repeat left 4px top 0px !important;
            background-size: 25px auto !important;
            line-height: 32px;
        }
    }
} */


#search:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #666;
  font-size: 1rem !important;
}
#search::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #666;
}
.dark #search::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #8a8a8a;
}
.dark #search:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #8a8a8a;
}
#search::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    opacity: 1; /* Firefox */
    font-size: 1rem !important;
    position: relative;
    top: -2px;
}
/* INTENTIONAL FIX FOR SAFARI */
@media not all and (min-resolution:.001dpcm) { @media {
    #search::placeholder {
        top: 5px;
        line-height: normal !important;
    }
}}
#search-options {
    border-radius: 8px;
    background: #fff;
    box-shadow: 0px 21px 28px rgba(0,0,0,0.25), 0px -3px 10px rgba(0,0,0,0.03);
    padding: 20px 30px;
    max-width: 650px;
    width: 100%;
    box-sizing: border-box;
    position: absolute;
    top: 40px;
    z-index: 1;
    opacity: 0;
    transition: all 0.2s ease-in-out;
    visibility: hidden;
}
.dark #search-options {
    background: #272727;
    color: white;
}
#search-options.focus {
    top: 50px;
    opacity: 1;
    visibility: visible;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    #search-options.focus {
        top: 75px;
        opacity: 1;
        visibility: visible;
    }
}
.search-label {
    display: inline-block;
    position: relative;
    top: -4px;
    font-size: 18px;
}
@media screen and (max-width: 39.9375em) {
    #search-options {
        width: 100%;
        padding: 10px;
    }
}
.search-switch {
    display: inline-block;
    position: relative;
    top: 2px;
    margin-left: 10px;
    margin-bottom: 0px;
}
.dark .switch-paddle {
    background: #404040;
}
#search-options ul.menu a {
    padding: 5px;
    font-size: 14px;
    color: #404040;
}
.dark #search-options ul.menu a {
    color: #ccc;
}
#search-options ul.menu a:hover,
#search-options li.active a {
    background: #f6f6f6;
    border-radius: 3px;
}
.dark #search-options ul.menu a:hover,
.dark #search-options li.active a {
    background: #1b1b1b;
}
#search-options ul.menu a span {
    color: #03151e;
    font-weight: bold;
    padding: 4px 5px;
    border-radius: 3px;
    display: inline-block;
    background: #e7e7e7;
    margin-right: 10px;
}
#search-options ul.menu a:hover span,
#search-options li.active a span {
    background: #0096B5;
    color: white;
}

/* libraries select */
#libraries-select label {
    height: 0px;
}
.library-select-wrapper {
    position: relative;
}
#libraries-select .chosen-container-single {
    width: 100% !important;
    box-sizing: border-box;
}
#libraries-select .chosen-container-single .chosen-single span {
    overflow: hidden;
    height: 28px;
    line-height: 28px;
}
#libraries-select .chosen-container-single .chosen-single {
    background: #eeeeef;
    border: none;
    outline: none;
    box-shadow: none;
    color: #03151E;
    font-weight: bold;
    font-size: 26px;
    height: auto;
    padding: 18px 20px 18px 20px;
    margin: 0px 0px 0px;
    border-radius: 5px;
}
.dark #libraries-select .chosen-container-single .chosen-single {
    background: #282828;
    color: white;
}
#libraries-select .chosen-container-active.chosen-with-drop .chosen-single {
    background: #eeeeef;
    border-radius: 5px 5px 0px 0px;
    /* box-shadow: 0px 20px 25px rgba(0,0,0,0.2), 0px -9px 22px -12px rgba(0,0,0,0.2); */
}
.dark #libraries-select .chosen-container-active.chosen-with-drop .chosen-single {
    background: #282828;
}
#libraries-select .chosen-container-single .chosen-single div {
    width: 50px;
    height: 100%;
}
#libraries-select .chosen-container-single .chosen-single div b {
    background: url(/img/library/icons/icon-right-arrow-gray.svg) no-repeat center center;
    background-size: 16px auto;
    width: 40px;
    height: 100%;
    transition: all 0.1s ease-in-out;
}
#libraries-select .chosen-container-active.chosen-with-drop .chosen-single div b {
    /* background: url(/img/library/icons/icon-down-arrow-gray.svg) no-repeat center center;
    background-size: auto 16px;
    width: 40px;
    height: 100%; */
    transform: rotate(90deg);
}
#libraries-select .chosen-container .chosen-drop {
    background: rgb(238 238 239 / 90%);
    -webkit-backdrop-filter: blur(20px) saturate(200%);
    backdrop-filter: blur(20px) saturate(200%);
    border: none;
    box-shadow: none;
    box-sizing: border-box;
    padding: 0px 20px;
    border-radius: 0px 0px 5px 5px;
    box-shadow: 0px 20px 20px -10px rgba(0,0,0,0.25);
}
.dark #libraries-select .chosen-container .chosen-drop {
    background: rgb(40 40 40 / 90%);
}
@-moz-document url-prefix() {
    #libraries-select .chosen-container .chosen-drop {
        background: #eeeeef;
    }
    .dark #libraries-select .chosen-container .chosen-drop {
        background: #282828;
    }
}
#libraries-select .chosen-container .chosen-results li  {
    font-size: 22px;
    font-weight: bold;
    padding: 10px 10px;
    display: block;
    margin: 5px 0px;
    color: #03151E;
    line-height: 1em;
    position: relative;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.dark #libraries-select .chosen-container .chosen-results li {
    color: white;
}
#libraries-select .chosen-container .chosen-results li.highlighted {
    background: rgba(0,0,0,0.03);
    border-radius: 5px;
}
.dark #libraries-select .chosen-container .chosen-results li.highlighted {
    background: rgba(0,0,0,0.5);
}
#libraries-select .chosen-container-single .chosen-search input[type=text] {
    background: url(/img/library/icons/icon-search-gray.svg) no-repeat left 10px center white;
    background-size: 20px auto;
    border: none;
    border-radius: 5px;
    padding: 10px;
    text-indent: 30px;
    font-size: 22px;
    color: #666;
}
.dark #libraries-select .chosen-container-single .chosen-search input[type=text] {
    background: url(/img/library/icons/icon-search-gray.svg) no-repeat left 10px center #181818;
    background-size: 20px auto;
    color: #dedede;
}
#libraries-select .chosen-container-single .chosen-search input[type=text]:focus {
    box-shadow: none;
}
#libraries-select .chosen-container .chosen-results li.no-results {
    background: transparent;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi), only screen and (min-resolution: 1.5dppx) {
    #libraries-select .chosen-container .chosen-results-scroll-down span, #libraries-select .chosen-container .chosen-results-scroll-up span, #libraries-select .chosen-container-multi .chosen-choices .search-choice .search-choice-close, #libraries-select .chosen-container-single .chosen-single abbr, #libraries-select .chosen-rtl .chosen-search input[type=text] {
        background-image: none !important;
    }
    #libraries-select .chosen-container-single .chosen-search input[type=text] {
        background: url(/img/library/icons/icon-search-gray.svg) no-repeat left 10px center white !important;
        background-size: 20px auto !important;
    }
    #libraries-select .chosen-container-single .chosen-single div b {
        background: url(/img/library/icons/icon-right-arrow-gray.svg) no-repeat center center !important;
        background-size: 16px auto !important;
    }
}
@media screen and (max-width: 39.9375em) {
	select#library-select {
        background: url(/img/library/icons/icon-right-arrow-gray.svg) no-repeat center right 12px #eeeeef;
        background-size: 14px auto;
        border: none;
        outline: none;
        box-shadow: none;
        color: #03151E;
        font-weight: bold;
        font-size: 18px;
        height: auto;
        padding: 12px 46px 12px 12px;
        margin: 0px;
        border-radius: 5px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .dark select#library-select {
        color: white;
        background: url(/img/library/icons/icon-right-arrow-gray.svg) no-repeat center right 12px #282828;
        background-size: 14px auto;
    }
}
h6.item-count {
    position: absolute;
    top: 23px;
    right: 50px;
    font-size: 13px;
    font-weight: bold;
    color: #404040;
    text-align: right;
    z-index: 1;
    border: 1px solid #bbb;
    display: inline-block;
    border-radius: 5px;
    padding: 0px 3px;
    line-height: 17px;
}
h6.item-count:empty {
    display: none;
}
h6.item-count-mobile {
    top: 17px;
    right: 35px;
}
.dark h6.item-count {
    color: white;
    border: 1px solid #666;
}
#search-sort-filter,
#library-sort-filter {
    position: relative;
    top: 6px;
}
#view-filters {
    position: relative;
    top: 5px;
}
#search-sort-filter select,
#library-sort-filter select {
    width: 130px;
    border: 2px solid #dedede;
    border-radius: 8px;
    color: #03151E;
    font-size: 14px;
    padding-left: 40px;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    height: 38px;
    transition: all 0.3s ease-in-out;
    margin-left: 10px;
    box-shadow: none;
}
.dark #search-sort-filter select,
.dark #library-sort-filter select {
    border-color: #282828;
    color: white;
}
@media screen and (max-width: 320px) {
    #search-sort-filter select,
    #library-sort-filter select {
        width: 128px
    }
}
#library-sort-filter select#library-layout {
    width: 125px;
    padding-right: 5px;
    transition: all 0.3s ease-in-out;
}
#library-layout.item-list {
    background: url(/img/library/icons/icon-view-list-dark.svg) no-repeat left 12px top 8px;
    background-size: 20px auto;
}
#library-layout.item-cover {
    background: url(/img/library/icons/icon-view-cover-dark.svg) no-repeat left 12px top 7px;
    background-size: 22px auto;
}
#library-layout.item-summary {
    background: url(/img/library/icons/icon-view-summary-dark.svg) no-repeat left 12px top 9px;
    background-size: 18px auto;
}
.dark #library-layout.item-list {
    background: url(/img/library/icons/icon-view-list-white.svg) no-repeat left 12px top 8px #131313;
    background-size: 20px auto;
}
.dark #library-layout.item-cover {
    background: url(/img/library/icons/icon-view-cover-white.svg) no-repeat left 12px top 7px #131313;
    background-size: 22px auto;
}
.dark #library-layout.item-summary {
    background: url(/img/library/icons/icon-view-summary-white.svg) no-repeat left 12px top 9px #131313;
    background-size: 18px auto;
}

#search-sort-filter select:hover,
#library-sort-filter select:hover {
    box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
}
.dark #search-sort-filter select:hover,
.dark #library-sort-filter select:hover {
    box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
}
#search-sort-filter select#search-sort,
#library-sort-filter select#library-sort {
    background-image: none;
    padding-right: 5px;
    border-radius: 8px 0px 0px 8px;
    background: url(/img/library/icons/icon-sort-dark.svg) no-repeat left 12px center;
    background-size: 20px auto;
    border-right: none;
}
.dark #search-sort-filter select#search-sort,
.dark #library-sort-filter select#library-sort {
    background: url(/img/library/icons/icon-sort-white.svg) no-repeat left 12px center #131313;
    background-size: 20px auto;
}
#search-sort-order,
#library-sort-order {
    display: inline-block;
    width: 44px;
    border: 2px solid #dedede;
    height: 38px;
    border-radius: 0px 8px 8px 0px;
    position: relative;
    top: -6px;
    left: -5px;
    margin-right: 5px;
    color: transparent;
}
.dark #search-sort-order,
.dark #library-sort-order {
    border-color: #282828;
    background-color: #131313;
}
#search-sort-order:hover,
#library-sort-order:hover {
    box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
}
.dark #search-sort-order:hover,
.dark #library-sort-order:hover {
    box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
}
#search-sort-order span,
#library-sort-order span {
    display: block;
    transition: all 0.3s ease-in-out;
    background: url(/img/library/icons/icon-sort-arrow-down-dark.svg) no-repeat center center;
    background-size: 22px auto;
    height: 100%;
}
.dark #search-sort-order span,
.dark #library-sort-order span {
    display: block;
    transition: all 0.3s ease-in-out;
    background: url(/img/library/icons/icon-sort-arrow-down-white.svg) no-repeat center center;
    background-size: 22px auto;
    height: 100%;
}
#search-sort-order.desc span,
#library-sort-order.desc span {
    transform: rotate(-180deg);
}
#view-filters {
    height: 36px;
    border: none;
    font-weight: 400;
    position: relative;
    margin-top: 2px;
    padding-left: 40px;
    padding-right: 20px;
    background: url(/img/library/icons/icon-filter-white.svg) no-repeat left 10px center #4BC1D2;
    background-size: 22px auto;
    color: #fff;
}
.dark #view-filters {
    background-color: #0096B5;
}
#view-filters:hover {
    background-color: #0096B5;
}
.dark #view-filters:hover {
    background-color: #007c96;
}
.filters-custom {
    width: 460px;
    /* margin-bottom: 30px; */
}
@media screen and (max-width: 39.9375em) {
    .filters-custom {
        text-align: left;
        margin-top: 5px;
    }
    #library-sort-filter select#library-layout {
        width: 44px;
        margin-left: 0px;
    }
    #search-sort-filter select#search-sort,
    #library-sort-filter select#library-sort {
        margin-left: 2px;
    }
    #library-layout.item-cover {
        background: url(/img/library/icons/icon-view-cover-dark.svg) no-repeat left 10px top 7px;
        background-size: 22px auto;
    }
    .dark #library-layout.item-cover {
        background: url(/img/library/icons/icon-view-cover-white.svg) no-repeat left 10px top 7px;
        background-size: 22px auto;
    }
    #library-layout.item-summary {
        background: url(/img/library/icons/icon-view-summary-dark.svg) no-repeat left 13px top 9px;
        background-size: 18px auto;
    }
    .dark #library-layout.item-summary {
        background: url(/img/library/icons/icon-view-summary-white.svg) no-repeat left 13px top 9px;
        background-size: 18px auto;
    }
    #view-filters {
        color: transparent;
        width: 44px;
        padding-left: 0px;
        background-position: center center;
        margin-top: -5px;
        float: right;
    }
    #az-filter {
        padding-top: 5px;
    }
}
@media only screen and (max-width: 1200px) {
    .filters-custom {
        display: block;
        width: 100%;
    }

    #libraries-select .cell.large-auto {
        width: 100%;
        display: block;
        -webkit-box-flex: none;
        -webkit-flex: none;
        flex: none;
        position: relative;
    }
}

/* FILTER SIDEBAR */
#primary.filter-open {
    right: 260px;
}
#filter-sidebar {
    width: 260px;
    position: absolute;
    right: -260px;
    top: 0px;
    bottom: 0px;
    box-shadow: -6px 0px 16px -10px rgba(0,0,0, 0.2);
    box-sizing: border-box;
    padding: 0px;
    transition: all 0.2s ease-in-out;
    background: white;
    overflow-y: auto;
    z-index: 1012;
}
#filter-sidebar.filter-open {
    right: 0px;
}
.filter-title .clear-all-filters, .clear-filter {
    color: #03151E;
    padding: 5px 5px;
    display: inline-block;
    border-radius: 4px;
    background: rgba(0,0,0,0.05);
    font-size: 14px;
    transition: 0.3s ease-in-out;
}
.filter-title .clear-all-filters:hover {
    background: #dedede;
}
.dark .filter-title .clear-all-filters {
    background: rgba(255,255,255,.05);
    color: white;
}
.dark .filter-title .clear-all-filters:hover {
    background: #404040;
}
.filter-title {
    padding: 30px 0px 15px;
    margin: 0px 15px 0px;
}
.sticky-header {
    position: sticky;
    top: 0px;
    background: #fff;
    z-index: 100;
    transition: all 0.3s ease-in-out;
}
.sticky-header.scroll {
    box-shadow: 0px 8px 16px -10px rgb(0 0 0 / 30%);
}
.dark .sticky-header {
    background: #1b1b1b;
}
.dark .sticky-header.scroll {
    box-shadow: 0px 8px 16px -10px rgb(0 0 0 / 70%);
}
ul.filter-accordion {
    border-bottom: 1px soild #ececec;
}
ul.filter-accordion.accordion li {
    margin-bottom: 0px;
    position: relative;
}
ul.filter-accordion .accordion-content {
    padding: 5px 15px 15px;
}
.filter-accordion .accordion-title,
.filter-accordion .accordion-item .accordion-content,
.filter-accordion li:last-child:not(.is-active) > .accordion-title {
    border: none;
}
.filter-accordion .accordion-title {
    font-size: 16px;
    border-top: 1px solid #ececec;
    border-radius: 0px !important;
}
#tag-filter-label span.inclusive {
    position: absolute;
    height: 24px;
    width: 30px;
    background-image: url(/img/library/icons/icon-venn-light.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 24px;
    right: 45px;
    top: 11px;
    display: block;
    box-sizing: border-box;
}
.dark #tag-filter-label span.inclusive {
    background-image: url(/img/library/icons/icon-venn-dark.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 24px;
}

.dark .filter-accordion .accordion-title {
    border-top: 1px solid #282828;
}
.filter-accordion li:last-child:not(.is-active) > .accordion-title {
    border-top: 1px solid #ececec;
}
.dark .filter-accordion li:last-child:not(.is-active) > .accordion-title {
    border-top: 1px solid #282828;
}
.filter-accordion .accordion-title::before {
    background-size: 8px auto;
}
.filter-accordion .accordion-title:focus {
    background: transparent;
}
.dark #filter-sidebar {
    background: #1B1B1B;
    box-shadow: -6px 0px 16px -10px rgba(0, 0, 0, 0.7);
}
.filter-accordion label {
    color: #666;
    font-size: 14px;
    display: block;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    z-index: 1;
    cursor: pointer;
}
.dark .filter-accordion label {
    color: #8a8a8a;
}
.filter-accordion label span.count {
    font-size: 12px;
}
.filter-accordion input[type="checkbox"]:checked + span.checkmark + label,
.filter-accordion input[type="radio"]:checked + span.radiomark + label {
    color: #03151E;
    font-weight: bold;
}
.dark .filter-accordion input[type="checkbox"]:checked + span.checkmark + label,
.dark .filter-accordion input[type="radio"]:checked + span.radiomark + label {
    color: white;
}
span.item-type-count {
    background-color: #EAF3F4;
    border-radius: 3px;
    display: inline-block;
    padding: 0px 6px;
    font-size: 11px;
    font-weight: bold;
    color: #0096B5;
    position: absolute;
    right: 10px;
    top: 4px;
}
.dark span.item-type-count {
    background: rgba(255,255,255,0.05);
    color: #EAF3F4;
}
.filter-accordion input[type="checkbox"]:checked + span.checkmark + label span.item-type-count,
.filter-accordion input[type="radio"]:checked + span.radiomark + label span.item-type-count {
    color: #EAF3F4;
    background-color: #0096B5;
}
.dark .filter-accordion input[type="checkbox"]:checked + span.checkmark + label span.item-type-count,
.dark .filter-accordion input[type="radio"]:checked + span.radiomark + label span.item-type-count {
    color: #03151E;
    background-color: #0096B5;
}
.filter-accordion .menu.vertical li {
    padding: 4px 0px;
}
@media screen and (max-width: 63.9375em) {
	#primary.filter-open {
        right: 0px;
    }
    #filter-sidebar {
        bottom: 0px;
        top: 100%;
        right: 0px;
        left: 0px;
        width: 100%;
    }
    #filter-sidebar.filter-open {
        right: 0px;
        top: 61px;
    }
}
@media screen and (max-width: 39.9375em) {
	#filter-sidebar {
        position: fixed;
    }
}
.checkbox-menu li,
.radio-menu li {
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
input[type="checkbox"].fancy-checkbox,
input[type="radio"].fancy-radio {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
span.checkmark,
span.radiomark {
    position: absolute;
    top: 9px;
    left: 0px;
    border: 1px solid #ccc;
    height: 16px;
    width: 16px;
    border-radius: 2px;
    background-color: #f6f6f6;
}
span.radiomark {
    border-radius: 100%;
}
.dark span.checkmark,
.dark span.radiomark {
    background: #101010;
    border: 1px solid #282828;
}
.checkbox-menu li:hover input ~ .checkmark,
.radio-menu li:hover input ~ .radiomark {
    background-color: #EFEFEF;
}
.dark .checkbox-menu li:hover input ~ .checkmark,
.dark .radio-menu li:hover input ~ .radiomark {
    background-color: #131313;
}
/* .checkbox-menu li input:checked ~ .checkmark {

} */
.checkmark:after,
.radiomark:after {
    content: "";
    position: absolute;
    display: none;
}
.checkbox-menu li input:checked ~ .checkmark:after,
.radio-menu li input:checked ~ .radiomark:after {
    display: inline-block;
}
.checkmark:after,
.radiomark:after {
    text-shadow: none;
    background-color: transparent;
    background-image: url(/img/library/datatables/check.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 17px auto;
    height: 17px;
    width: 17px;
    border-radius: 0px;
    left: -1px;
    top: -1px;
    border-radius: 2px;
}
.radiomark:after {
    border-radius: 100%;
    background-image: url(/img/library/datatables/radio.svg);
    background-repeat: no-repeat;
    background-size: 17px auto;
}
input[type="search"].search-tag-filter {
    background: url(/img/library/icons/icon-search-gray.svg) no-repeat right 15px center;
    background-size: 15px auto;
    text-indent: 5px;
}
.dark input[type="search"].search-tag-filter {
    border: 1px solid #232323;
    background-color: #131313;
}
span.active-filters {
    margin-left: 10px;
    display: inline-block;
    background: rgba(0,0,0,0.05);
    border-radius: 3px;
    text-align: center;
    font-size: 12px;
    padding: 0px 20px 0px 8px;
    height: 24px;
    line-height: 24px;
    position: absolute;
    top: 12px;
    /* right: 42px; */
    transition: all 0.3s ease-in-out;
    font-weight: bold;
    max-width: 135px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
}
#tag-filter span.active-filters,
#item-filter span.active-filters {
    left: 50px;
}
#status-filter span.active-filters {
    left: 63px;
}
span.active-filters:hover {
    background: #dedede;
}
.active-filters:after {
    content: "×";
    font-weight: bold;
    font-size: 18px;
    position: absolute;
    right: 6px;
    top: 0px;
    opacity: 0.3;
    transition: all 0.3s ease-in-out;
}
.active-filters:hover:after {
    opacity: 0.7;
}
.dark span.active-filters {
    background: rgba(255,255,255,0.05);
}
.dark span.active-filters:hover {
    background: #404040;
}
/* COVER VIEW - ITEM LAYOUT */

#library-items-wrapper {
    margin-top: 0px;
}
@media screen and (max-width: 39.9375em) {
    #item-list-wrapper,
    #item-summary-wrapper {
      padding-top: 20px;
    }
}
.letter-break {
    display: block;
    color: #4BC1D2;
    /* padding-bottom: 3px; */
    border-bottom: 1px solid #ececec;
    font-weight: bold;
    font-size: 24px;
    position: relative;
    margin-right: 25px;
    margin-left: 25px;
    /* cursor: pointer; */
}

.dark .letter-break {
    border-bottom: 1px solid #333;
}

/* .letter-break:hover {
    text-decoration: underline;
} */

.letter-break.split {
    display: block;
}

#library-items {
    margin-top: 30px;
    margin-left: -25px;
    margin-right: -25px;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    #library-items {
        margin-top: 25px;
    }
}
@media screen and (max-width: 39.9375em) {
	#library-items {
        margin-top: 5px;
    }
}
#library-items #items-wrapper {
    display: block;
}
.item.cover {
    width: 167px;
    height: auto;
    font-size: 12px;
    text-align: center;
    display: inline-block;
    box-sizing: border-box;
    color: #666;
    vertical-align: top;
    position: relative;
    padding: 20px;
    white-space: normal;
    margin: 0px 5px;
}
@media screen and (max-width: 63.9375em) {
	.item.cover {
        padding: 20px 15px;
        width: 146px
    }
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
    .item.cover {
        padding: 20px 15px;
        width: 148px;
    }
}
@media screen and (max-width: 39.9375em) {
	.item.cover {
        width: calc(50% - 10px);
        padding: 20px 5px;
    }
    .grid-container {
        padding-right: 10px;
        padding-left: 10px;
    }
    .letter-break {
        margin-right: 10px;
        margin-left: 10px;
    }
    #search {
        line-height: 36px;
        padding-left: 40px;
        background: url(/img/library/icons/icon-search.svg) no-repeat 10px 9px;
        background-size: 20px auto;
    }
}
.item img {
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
    position: relative;
    transition: all 0.2s ease-in-out;
    width: 100%;
}
.item.summary .rating {
  text-align: center;
}
.item.summary .cover-wrapper img,
.item.cover .cover-wrapper {
    cursor: pointer;
}
.item.cover .cover-wrapper,
.item.summary .cover-wrapper {
    background: transparent;
    border-radius: 6px;
    position: relative;
    transition: all 0.2s ease-in-out;
    top: 0px;
    margin-bottom: 10px;
}
.item.cover:hover .cover-wrapper,
.item.summary .cover-wrapper:hover {
    box-shadow: 0px 6px 12px -4px rgba(0,0,0,0.5);
    top: -5px;
    background: #03151E;
}
.item.cover:hover img,
.item.summary .cover-wrapper:hover img {
    opacity: 0.6;
}
.cover .item-title {
    font-weight: bold;
    font-size: 14px;
    margin-top: 0px;
    margin-bottom: 1px;
    /* width: 120px; */
    /* white-space: nowrap; */
    /* text-overflow: ellipsis; */
    /* display: inline-block; */
    line-height: 1.4em;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cover .item-author {
    font-size: 12px;
    display: inline-block;
    text-align: center;
}
.dark .item-title {
    color: white;
}
.dark .item-author {
    color: #888;
}
.batch-select {
    position: absolute;
    bottom: 5px;
    right: 5px;
    height: 22px;
    width: 22px;
    background: white;
    border-radius: 100px;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.no-batch-edit .batch-select {
    display: none !important;
}
.item.cover:hover .batch-select,
.item.summary:hover .batch-select {
    opacity: 0.7;
}
.item.cover .cover-wrapper.selected,
.item.summary .cover-wrapper.selected {
    top: -5px;
    background: #03151E;
    transform: scale(1.05);
}
.batch-select:hover {
  background-size: 22px auto;
  opacity: 0.9 !important;
}
@media screen and (max-width: 63.9375em) {
	.batch-select {
        opacity: 0.5 !important;
    }
}
.selected .batch-select {
    background: url(/img/library/icons/icon-batch-select-white.svg) no-repeat center center #03151E;
    background-size: 22px auto;
    opacity: 1 !important;
}
.selected img {
    opacity: 0.6;
}
#batch-edit-panel #batch-notes-submit:hover,
#batch-edit-panel #batch-notes-submit:active,
#batch-edit-panel #batch-notes-submit:focus {
    background-color: #0096B5;
    color: #fff;
}
.dark #batch-edit-panel #batch-notes-submit:hover,
.dark #batch-edit-panel #batch-notes-submit:active,
.dark #batch-edit-panel #batch-notes-submit:focus {
    background-color: #007c96;
    color: #fff;
}

/* ADD ITEMS - PAGE */
#manual-entry-fields {
  display: none;
}
h3.add-item-results-title {
    font-weight: 600;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #dedede;
    font-size: 44px;
}
.dark h3.add-item-results-title {
    border-top: 1px solid #282828;
}
.item-add-container {
    margin: 30px 0px;
}
@media screen and (max-width: 39.9375em) {
	h3.add-item-results-title {
        font-size: 30px;
    }
}
#add-item-result-set {
    max-width: 1200px;
}
#add-item-result-set .cover-wrapper {
    margin-bottom: 20px;

}
#add-item-result-set .cover-wrapper img {
    border-radius: 6px;
    box-shadow: 0px 0px 1px 1px rgb(0 0 0 / 10%);
    max-width: 250px;
    width: 100%;
}
@media screen and (max-width: 39.9375em) {
	.item-add-container .medium-3 {
        text-align: left;
    }
    #add-item-result-set .item-detail-delete-item {
        margin-right: 10px;
    }
}
.item-exists {
    font-size: 12px;
    margin-bottom: 10px;
}
#add-item-result-set .description {
    font-size: 14px;
    line-height: 1.8em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 8; /* number of lines to show */
    -webkit-box-orient: vertical;
}
/* CSV ITEM UPLOAD PAGE */
.info {
    padding: 20px 20px 20px 60px;
    margin-bottom: 20px;
    background: url(/img/library/icons/icon-info-blue.svg) no-repeat left 18px top 20px #f6f6f6;
    background-size: 24px auto;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.6em;
}
.dark .info {
    background-color: #282828;
}

.csvgui-element {
    margin-top: 15px;
    margin-bottom: 15px;
    border-radius: 4px;
    background: #efefef;
    border: 1px solid #dedede;
}
.dark .csvgui-element {
    border: 1px solid #282828;
    background: #1f1f1f;
}
.csvgui-element strong {
    padding: 10px 20px;
    display: block;
    color: #999;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.csvgui-select-container {
    padding: 0px 20px;
}
.csvgui-element ul {
    margin-left: 0px;
    margin-bottom: 0px;
    border-radius: 0px 0px 8px 8px;
}
.csvgui-element.column-found {
    background: #fff;
    box-shadow: 0px 5px 20px -7px rgba(0,0,0,0.3);
}
.dark .csvgui-element.column-found {
    background: #131313;
    box-shadow: 0px 5px 20px -7px rgba(0,0,0,0.9);
}
.csvgui-element.column-found strong {
    color: #03151E;
    background: url(/img/library/icons/icon-check.svg) right 20px center no-repeat;
    background-size: 20px auto;
    padding: 10px 40px 10px 20px;
}
.dark .csvgui-element.column-found strong {
    color: #fff;
    background: url(/img/library/icons/icon-check-white.svg) right 20px center no-repeat;
    background-size: 20px auto;
}
.csvgui-element.column-found ul {
    background-color: #fff;
}
.dark .csvgui-element.column-found ul {
    background-color: #131313;
}
.csvgui-element ul li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #999;
    padding: 5px 20px;
    border-bottom: 1px solid #dedede;
}
.dark .csvgui-element ul li {
    border-bottom: 1px solid #282828;
}
.csvgui-element ul li:first-child {
    border-top: 1px solid #dedede;
}
.dark .csvgui-element ul li:first-child {
    border-top: 1px solid #282828;
}
.csvgui-element ul li:last-child {
    border-bottom: none;
}
.csvgui-element.column-found ul li {
    color: #03151E;
}
.dark .csvgui-element.column-found ul li {
    color: #fff;
}
input[name="item-add-search"] {
    background-image: url(/img/library/icons/icon-search-gray.svg);
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 15px auto;
}

/* SUMMARY VIEW & LIST VIEW */
.item.summary {
    width: calc(50% - 40px);
    margin: 15px;
    left: 10px;
    height: auto;
    display: inline-block;
    box-sizing: border-box;
    vertical-align: top;
    position: relative;
    padding: 30px;
    white-space: normal;
    /* box-shadow: 0px 5px 10px rgba(0,0,0,0.1); */
    border: 1px solid #e6e6e6;
    border-radius: 8px;
    min-height: 350px;
    overflow: hidden;
}
.dark .item.summary {
    /* box-shadow: 0px 5px 10px rgba(0,0,0,0.7); */
    border: 1px solid #282828;
}
.item.list {
    margin-bottom: 30px;
    margin-right: 25px;
    margin-left: 25px;
    position: relative;
}
@media screen and (max-width: 1800px) {
	.item.summary {
        width: calc(100% - 50px);
        margin: 25px 0px 25px;
        display: block;
        min-height: auto;
        margin-left: 15px;
    }
}
@media screen and (min-width: 2300px) {
    .item.summary {
        width: calc(33.33333333% - 35px);
    }
}

@media screen and (min-width: 3400px) {
    .item.summary {
        width: calc(25% - 35px);
    }
}

#item-summary-wrapper {
    width: 100%;
}

#item-summary-wrapper .letter-break:first-child,
#item-list-wrapper .letter-break:first-child {
    margin-top: -15px;
}
#item-summary-wrapper .letter-break,
#item-list-wrapper .letter-break {
    display: block;
    margin-top: 20px;
    top: 0px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ececec;
}
#item-summary-wrapper .letter-break {
    margin-bottom: 10px;
}
.dark #item-summary-wrapper .letter-break,
.dark #item-list-wrapper .letter-break {
    border-bottom: 1px solid #333;
}

.item.summary:hover {
    box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
}
.dark .item.summary:hover {
    box-shadow: 0px 5px 20px rgba(0,0,0,0.7);
}
.item.summary .summary-left-col {
    width: 115px;
    display: inline-block;
    box-sizing: border-box;
}
.item.summary .summary-right-col {
    width: calc(100% - 115px);
    float: right;
    box-sizing: border-box;
    padding-left: 30px;
}
.item.summary .item-title,
.item.list .item-title,
#add-item-result-set .item-title {
    font-size: 26px;
    font-weight: bold;
    line-height: 1.2em;
    margin-bottom: 5px;
    cursor: pointer;
    display: block;
}
.item.summary .item-title,
#add-item-result-set .item-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.item.summary .item-title {
    padding-right: 30px;
}
@media screen and (max-width: 39.9375em) {
    .item.summary {
        min-height: auto;
        width: calc(100% - 20px);
        margin-left: 0px;
        margin-right: 0px;
        padding: 10px;
    }
    .item.summary .summary-left-col {
        width: 100px;
        display: block;
        box-sizing: border-box;
        float: left;
        margin-right: 20px;
    }
	.item.summary .summary-right-col {
        width: 100%;
        display: block;
        float: none;
        box-sizing: border-box;
        padding-left: 0px;
    }
    .item.list {
        margin-right: 10px;
        margin-left: 10px;
    }
    .item.summary .item-title,
    #add-item-result-set .item-title {
        font-size: 22px;
    }
    .item.summary .item-title,
    .item.list .item-title,
    #add-item-result-set .item-title {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}
.item.summary .item-title:hover,
.item.list .item-title:hover {
    text-decoration: underline;
}
.item.summary .item-author,
.item.list .item-author,
#add-item-result-set .item-author {
    color: #8a8a8a;
    font-size: 16px;
    margin-bottom: 10px;
}
.item.list .item-title,
.item.list .item-author {
    margin-bottom: 0px;
}
.item.list .item-title {
    padding-right: 30px;
}
@media screen and (max-width: 39.9375em) {
	.item-list .item-title {
        padding-right: 0px;
    }
}
.list .batch-select {
    border: 1px solid #666;
    background-color: rgba(0,0,0,0.05);
    position: absolute;
    left: 0px;
    top: 34px;
    cursor: pointer;
    opacity: 0.3;
    height: 20px;
    width: 20px;
}

@media screen and (max-width: 39.9375em) {
	.list .batch-select {
    top: 31px;
  }

}
.dark .list .batch-select {
    background-color: rgba(255,255,255,0.05);
}
.list:hover .batch-select {
    opacity: 0.7;
    background-size: 20px auto;
}
.list.selected .batch-select {
    background: url(/img/library/icons/icon-batch-select-blue.svg) no-repeat center center #03151E;
    background-size: 20px auto;
    opacity: 1 !important;
    background-color: white;
    border: 1px solid transparent;
}
.dark .list.selected .batch-select {
    background: url(/img/library/icons/icon-batch-select-blue.svg) no-repeat center center #03151E;
    background-size: 20px auto;
    opacity: 1 !important;
    background-color: #1b1b1b;
    border: 1px solid transparent;
}
.item.list {
    padding-left: 32px;
}
.no-batch-edit .item.list {
    padding-left: 0px;
}
@media screen and (max-width: 39.9375em) {
	.item.list .item-title {
        font-size: 20px;
    }
    .item.list .item-author {
        font-size: 16px;
    }
    .item.list span.meta {
        font-size: 14px;
    }
}
.item-dv span.meta,
.item span.meta {
    font-size: 14px;
    margin-right: 10px;
    color: #03151E;
}
.dark .item-dv span.meta,
.dark .item span.meta {
    color: white;
}
.item.summary .admin-tabs-details {
    font-size: 14px;
    line-height: 1.8em;
}
.call, .lexile, .price {
    background: #efefef;
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
}
  .call {
    cursor: pointer;
  }
  .call:hover {
    background-color: #e1e1e1;
  }
.dark .call, .dark .lexile, .dark .price {
    background: #333;
}
  .dark .call:hover {
    background-color: #505050;
  }
.price {
    background: #e2fbee;
    color: #4aaf79;
}
.dark .price {
    background: #00381b;
}
.denomination {
    font-family: arial, sans-serif;
    font-size: 16px;
}
.available {
    padding-left: 30px;
    background: url(/img/library/icons/icon-lending.svg) no-repeat left center;
    background-size: 16px auto;
}
/* EDIT ITEM DETAILS VIEW */
#edit-details .button.tiny {
  margin-bottom: 0px;
}
#edit-details-status select {
  margin-bottom: 0px;
}
.group-autocomplete-suggestions,
.tag-autocomplete-suggestions {
  background: #fff;
  position: absolute;
  margin-top: -16px;
  left: 1em;
  right: 1em;
  z-index: 1;
  border-radius: 0px 0px 4px 4px;
  padding: 10px;
  box-shadow: 0px 3px 8px rgba(0,0,0, 0.3);
}
  .group-autocomplete-suggestions ul,
  .tag-autocomplete-suggestions ul {
    list-style: none;
    margin: 0;
    z-index: 1;
  }
    .group-autocomplete-suggestions ul li,
    .tag-autocomplete-suggestions ul li {
        padding: 5px 10px;
    }
    .group-autocomplete-suggestions ul li:hover,
    .tag-autocomplete-suggestions ul li:hover,
    .group-autocomplete-suggestions ul li.active,
    .tag-autocomplete-suggestions ul li.active {
      background: #4BC1D2;
      cursor: pointer;
      color: #fff;
      border-radius: 4px;
    }
    .dark .group-autocomplete-suggestions ul li:hover,
    .dark .tag-autocomplete-suggestions ul li:hover,
    .dark .group-autocomplete-suggestions ul li.active,
    .dark .tag-autocomplete-suggestions ul li.active {
      background: #4BC1D2;
      cursor: pointer;
      color: #131313;
    }

.dark .group-autocomplete-suggestions,
.dark .tag-autocomplete-suggestions {
  border: 1px solid #1B1B1B;
  background: #131313;
}


#preview-image {
  height: 100px;
  width: 100px;
  object-fit: cover;
  border-radius: 5px;
}

/* END EDIT ITEM DETAILS VIEW */

/* ITEM DETAILS VIEW */
#check-in-mode-view,
#item-details-view {
    background: #fff;
    position: fixed;
    transition: all 0.5s ease-in-out;
    width: calc(100% - 235px);
    left: -100%;
    top: 0px;
    bottom: 0px;
    z-index: 1013;
    overflow-y: auto;
    padding: 40px;
    padding-top: 100px;
    box-shadow: 10px 0px 60px rgba(0,0,0,0.1);
}
#edit-item-details {
    background-color: white;
    position: fixed;
    z-index: 1014;
    top: 60px;
    right: auto;
    bottom: 0px;
    width: calc(100% - 235px);
    left: -100%;
    box-shadow: 10px 0px 60px rgba(0,0,0,0.1);
    overflow-y: auto;
    padding: 40px;
    transition: all 0.5s ease-in-out;
}
.dark #check-in-mode-view,
.dark #item-details-view {
    background: #1B1B1B;
    box-shadow: 10px 0px 60px rgba(0,0,0,0.7);
}
.dark #edit-item-details {
    /* box-shadow: 10px 0px 60px rgba(0,0,0,0.7); */
    background: #1b1b1b;
}
#edit-item-details form,
#edit-item-details #edit-details,
form#manual-entry-form {
    /* padding: 40px 40px 0px 40px;
    box-shadow: 0px 8px 15px -7px rgb(0 0 0 / 25%);
    border-radius: 8px;
    border: 1px solid #ececec; */
    margin: auto;
    max-width: 1000px;
}
input#edit-item-submit {
    margin-right: 10px;
}
button#edit-details-delete-status {
    top: 5px;
    position: relative;
}
input#item-details-add-copy-number {
  display: inline-block;
  width: 50px;
}
.item-copies table button,
.item-copies table input {
  margin-bottom: 0px;
}
#add-copy-button {
  margin: 0;
  margin-left: 10px;
  position: relative;
  top: -2px;
}
.button.delete-copy-button, .button.delete-copy-button:hover {
    text-indent: -999999px;
    width: 44px;
    padding-left: 0px;
    position: relative;
    top: -2px;
    background-image: url(/img/library/icons/icon-trash-white-solid.svg);
}
.button.save-copy-button, .button.save-copy-button:hover {
    background-image: url(/img/library/icons/icon-save-dark-2.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 14px auto;
    text-indent: -999999px;
    width: 44px;
    padding-left: 0px;
    position: relative;
    top: -2px;
    background-color: #ececec;
}
.button.save-copy-button.hover,
.button.save-copy-button:hover {
    background-color: #4BC1D2;
    background-image: url(/img/library/icons/icon-save-white-2.svg);
}
.dark .button.save-copy-button, .dark .button.save-copy-button:hover {
    background-image: url(/img/library/icons/icon-save-white-2.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 14px auto;
    text-indent: -999999px;
    width: 44px;
    padding-left: 0px;
    position: relative;
    top: -2px;
    background-color: #282828;
}
.dark .button.save-copy-button.hover,
.dark .button.save-copy-button:hover {
    background-color: #0096B5;
}

/* COPIES MOBILE */
@media screen and (max-width: 39.9375em) {
	.item-copies thead {
        display: none;
    }
    .item-copies tbody tr {
        padding-bottom: 15px;
        margin-bottom: 15px;
        display: block;
        border-bottom: 1px solid #dedede;
    }
    .dark .item-copies tbody tr {
        border-bottom: 1px solid #333;
    }
    .item-copies td {
        padding: 5px;
    }
    td.copy-column-id {
        width: 20px;
        display: inline-block;
    }
    td.copy-barcode-info {
        width: calc(100% - 68px);
        display: inline-block;
    }
    td.copy-lock-icon {
        width: 46px;
        display: inline-block;
        text-align: center;
    }
    td.copy-condition-value {
        width: calc(100% - 120px);
        display: inline-block;
        margin-left: 20px;
        position: relative;
        top: -2px;
    }
    td.copy-button-column {
        width: 50px;
        display: inline-block;
        text-align: center;
    }
}

#status-update-section {
    margin-bottom: 20px;
    padding-bottom: 10px;
}
.small-12.edit-actions {
    margin-left: -25px;
    margin-right: -25px;
    padding: 20px 40px 5px;
    width: calc(100% + 50px);
    border-radius: 0px 0px 8px 8px;
    border-top: 1px solid #ececec;
}
@media screen and (min-width: 64em) {
	#edit-item-details.open .small-12.edit-actions,
    body form#manual-entry-form .small-12.edit-actions {
        padding: 20px 40px 5px;
        position: fixed;
        left: 235px;
        bottom: 0px;
        right: 0px;
        box-shadow: -2px 0px 8px rgb(0 0 0 / 10%);
        background: #fff;
        margin-left: 0px;
        margin-right: 0px;
        border-radius: 0px;
        width: calc(100% - 235px);
    }
    .dark #edit-item-details.open .small-12.edit-actions,
    body.dark form#manual-entry-form .small-12.edit-actions {
        background: #1b1b1b;
        box-shadow: -2px 0px 8px rgb(0 0 0 / 70%);
        border-top: none;
    }
    #manual-entry-fields {
        margin-bottom: 80px;
    }
}
form#manual-entry-form .small-12.edit-actions {
    margin-left: -40px;
    margin-right: -40px;
    padding: 20px 40px 5px;
    width: calc(100% + 80px);
    border-radius: 0px 0px 8px 8px;
    border-top: 1px solid #ececec;
    margin-top: 20px;
}
.dark .small-12.edit-actions,
.dark form#manual-entry-form .small-12.edit-actions {
    border-top: 1px solid #282828;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    button#edit-item-cancel {
        margin-right: 40px;
        position: relative;
        top: -15px;
    }
    .edit-actions button#edit-item-cancel {
        top: 0px;
    }
}
@media screen and (max-width: 39.9375em) {
	#edit-item-details form,
    #edit-item-details #edit-details,
    .dark #edit-item-details form,
    .dark #edit-item-details #edit-details,
    form#manual-entry-form,
    .dark form#manual-entry-form {
        box-shadow: none;
        border: none;
        padding: 0px;
        border-radius: 0px;
    }
    button#edit-item-cancel {
        margin-right: 40px;
    }
    .small-12.edit-actions,
    .dark .small-12.edit-actions,
    form#manual-entry-form .small-12.edit-actions {
        margin-left: 10px;
        margin-right: 10px;
        padding: 0px;
        border: none;
        width: 100%;
    }
    form#manual-entry-form .small-12.edit-actions {
        padding-top: 30px;
        border-top: 1px solid #ececec;
        margin-left: 0px;
        margin-right: 0px;
    }
    .edit-actions input#edit-item-submit {
        width: calc(50% - 17px);
    }
    .edit-actions button#edit-item-cancel {
        width: calc(50% - 17px);
        margin-right: 0px;
    }
}
#check-in-mode-view.open,
#item-details-view.open {
    top: 0;
    bottom: auto;
    left: 235px;
    width: calc(100% - 235px);
    height: 100%;
    z-index: 1013;
}
#edit-item-details.open {
    top: 60px;
    bottom: 0px;
    right: 0px;
    left: 235px;
    width: calc(100% - 235px);
    height: 100%;
    z-index: 1013;
}
#move-dialog {
  min-height: 75px;
}
.check-in-mode-header,
.item-header {
    height: 60px;
    box-shadow: -2px 0px 8px rgba(0,0,0,0.1);
    position: fixed;
    top: 0px;
    left: -100%;
    right: auto;
    z-index: 1015;
    background: #fff;
    transition: all 0.5s ease-in-out;
}
.dark .check-in-mode-header,
.dark .item-header {
    background: #1b1b1b;
    box-shadow: -2px 0px 8px rgba(0,0,0,0.7);
}
#check-in-mode-view.open .check-in-mode-header,
#item-details-view.open .item-header {
    top: 0px;
    left: 235px;
    right: 0px;
}
.check-in-mode-header .close,
.item-header .close,
.close-filters,
#batch-edit-close.close,
.close.img-overlay-close,
.item-header .item-flag-button {
    border-radius: 100%;
    height: 40px;
    width: 40px;
    background-position: center center;
    top: 10px;
    border: 2px solid #efefef;
    background-size: 20px auto;
}
#batch-edit-close.close {
    top: 20px;
    right: 20px;
}
.dark .check-in-mode-header .close,
.dark .item-header .close,
.dark .close-filters,
.dark #batch-edit-close.close,
.dark .close.img-overlay-close,
.dark .item-header .item-flag-button {
    border: 1px solid #404040;
}
.item-edit-menu-wrapper {
    position: relative;
    top: 14px;
    margin-left: 40px;
}
.item-edit-menu-wrapper li {
    margin-right: 20px;
    text-align: center;
}
.item-edit-menu-wrapper li:last-child {
    margin-right: 0px;
}
.item-edit-menu-wrapper button,
.item-edit-menu-wrapper a {
    cursor: pointer;
    font-size: 14px;
    padding-left: 40px;
    background-position: left 15px center;
    background-repeat: no-repeat;
    padding: 10px 20px 10px 40px;
    border-radius: 6px;
}
.dark .item-edit-menu-wrapper button,
.dark .item-edit-menu-wrapper a {
    color: white;
}
.item-edit-menu-wrapper button:hover,
.item-edit-menu-wrapper a:hover {
    background-color: #efefef;
}
.dark .item-edit-menu-wrapper button:hover,
.dark .item-edit-menu-wrapper a:hover {
    background-color: #333;
}
.item-edit-button {
    background-image: url(/img/library/icons/icon-edit.svg);
    background-size: 18px auto;
}
.item-user-details-button {
    background-image: url(/img/library/icons/icon-user-details.svg);
    background-size: 20px auto;
}
.item-move-button {
    background-image: url(/img/library/icons/icon-move-item.svg);
    background-size: 18px auto;
}
.item-flag-button {
    background-image: url(/img/library/icons/icon-flag-item.svg);
    background-size: 18px auto;
    display: block;
    text-indent: -999999px;
}
.dark .item-edit-button {
    background-image: url(/img/library/icons/icon-edit-white.svg);
    background-size: 18px auto;
}
.dark .item-user-details-button {
    background-image: url(/img/library/icons/icon-user-details-white.svg);
    background-size: 20px auto;
}
.dark .item-move-button {
    background-image: url(/img/library/icons/icon-move-item-white.svg);
    background-size: 18px auto;
}
.dark .item-flag-button {
    background-image: url(/img/library/icons/icon-flag-item-white.svg);
    background-size: 18px auto;
}
.item-edit-menu-wrapper button.item-delete-button,
.item-edit-menu-wrapper a.item-delete-button {
    background-image: url(/img/library/icons/icon-trash-item.svg);
    background-size: 13px auto;
    color: #DF6C5E;
}
.item-edit-menu-wrapper button.item-delete-button:hover,
.item-edit-menu-wrapper a.item-delete-button:hover {
    background-color: #FFF4F4;
}
.dark .item-edit-menu-wrapper button.item-delete-button:hover,
.dark .item-edit-menu-wrapper a.item-delete-button:hover {
    background-color: #DF6C5E;
    color: white;
    background-image: url(/img/library/icons/icon-trash-item-white.svg);
    background-size: 13px auto;
}
#item-details-view .loading-icon {
    top: 100px;
    position: relative;
}
#item-details-view .summary-left-col {
    float: left;
    width: 200px;
    margin-right: 40px;
    box-sizing: border-box;
}
#item-details-view .summary-right-col {
    float: left;
    width: calc(100% - 280px);
    box-sizing: border-box;
    max-width: 860px;
}
.show-mobile {
    display: none !important;
}
#item-details-view .cover-wrapper {
    position: relative;
}
#item-details-view .cover-wrapper img {
    box-shadow: 8px 8px 15px rgba(0,0,0,0.25);
    border-radius: 6px;
    transition: 0.3s ease-in-out;
    cursor: pointer;
    width: 100%;
}
#item-details-view .cover-wrapper img.active {
    transform: scale(1.03);
}
#item-details-view .cover-wrapper:hover img {
    transform: scale(1.03);
}
#item-details-view .cover-wrapper.missing-img:hover img {
    transform: none;
    cursor: default;
}
#item-details-view .cover-wrapper .expand-img {
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: url(/img/library/icons/icon-fullscreen.svg) no-repeat center center;
    background-size: 20px auto;
    background-color: rgba(0,0,0,0.5);
    opacity: 0;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}
#item-details-view .cover-wrapper:hover .expand-img {
    opacity: 1;
}
.dark #item-details-view .cover-wrapper img {
    box-shadow: 8px 8px 15px rgba(0,0,0,0.75);
}
#img-overlay {
    position: fixed;
    z-index: 1020;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    background: rgba(255,255,255,0.7);
    -webkit-backdrop-filter: blur(20px) saturate(200%);
    backdrop-filter: blur(20px) saturate(200%);
    text-align: center;
    display: none;
    overflow: auto;
}
.dark #img-overlay {
    background: rgba(0,0,0,0.7);
}
@-moz-document url-prefix() {
    #img-overlay {
        background: rgba(255,255,255,0.95);
    }
    .dark #img-overlay {
        background: rgba(0,0,0,0.95);
    }
}
#item-overlay-info {
    max-width: 350px;
    width: 80%;
    margin: auto;
}
.overlay-title {
    font-weight: bold;
    font-size: 20px;
}
#img-overlay img {
    margin-top: 10%;
    position: relative;
    max-width: 80%;
    max-height: 60%;
    margin-bottom: 20px;
    border-radius: 6px;
    height: auto;
    width: auto;
}
@media screen and (max-width: 39.9375em) {
	#img-overlay img {
        margin-top: 25%;
    }
}
.item-library, .item-group {
    background: url(/img/library/icons/icon-libraries.svg) no-repeat left center;
    background-size: 22px auto;
    padding-left: 30px;
    font-size: 22px;
    display: inline-block;
    margin-right: 20px;
}
.item-group {
    background: url(/img/library/icons/icon-groups.svg) no-repeat left center;
    background-size: 22px auto;
}
.cover .item-group:empty,
.cover .item-group span:empty {
    display: none;
}
.cover .item-group {
    background-size: 15px auto;
    background-position: left 5px center;
    margin-right: 0px;
    height: 23px;
    display: block;
    text-align: center;
    padding-left: 26px;
    margin-bottom: 8px;
}
.cover .item-group span {
    padding: 2px 4px;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-radius: 4px;
    background-color: #f6f6f6;
    font-size: 13px;
}
.dark .cover .item-group span {
    background-color: #282828;
    color: #ccc;
}
.list .item-group,
.summary .item-group {
    font-size: 18px;
    background-size: 20px auto;
    margin-right: 0px;
    display: inline-block;
    margin-bottom: 5px;
    color: #03151E;
}
.list .item-group,
.summary .item-group {
    margin-right: 15px;
}
.list .item-group {
    font-size: 16px;
    margin-bottom: 0px;
    position: relative;
    top: -1px;
}
.media-tag {
    background: #ececec;
    color: #404040;
    border-radius: 4px;
    padding: 2px 6px;
    margin-bottom: 5px;
    font-size: 10px;
    font-weight: bold;
    position: relative;
    top: -3px;
    display: inline-block;
}
#item-details-view .media-tag {
    font-size: 12px;
    padding: 2px 10px;
}
.dark .media-tag {
    background: #404040;
    color: #fff;
}
/* hide for now */
.summary .media-tag {
    display: none;
}
.dark .list .item-group,
.dark .summary .item-group {
    color: #fff;
}
#item-details-view .item-title {
    padding-top: 20px;
    font-weight: bold;
    font-size: 36px;
    line-height: 1.2em;
}
#item-details-view .item-author,
#item-details-view .item-ensemble {
    font-size: 24px;
    margin-bottom: 20px;
    color: #8a8a8a;
}
#item-details-view .item-ensemble {
    font-size: 18px;
    margin-top: -10px;
}
#item-details-view .star-rating {
    margin-top: 30px;
    text-align: center;
    transform: scale(1.5);
}
.star-half-even {
  display:inline-block;
  width: 10px;
  height: 19px;
  background:url('/img/library/icons/stars_half_sprite-transparent@2x.png') 10px 38px;
  background-size: 100%;
}
  .star-half-even.star-fill {
    background:url('/img/library/icons/stars_half_sprite-transparent@2x.png') 10px 19px;
    background-size: 100%;
  }

.star-half-odd {
  display:inline-block;
  width: 10px;
  height: 19px;
  background:url('/img/library/icons/stars_half_sprite-transparent@2x.png') 10px 0px;
  background-size: 100%;
}
  .star-half-odd.star-fill {
    background:url('/img/library/icons/stars_half_sprite-transparent@2x.png') 10px 57px;
    background-size: 100%;
  }

select#rating {
    width: 80px;
}
#item-details-view .tab-item2,
#item-details-view .tab-item {
    display: none;
}

#item-details-view .item-status,
#item-details-view .item-description {
    display: block;
}
.item-tags span {
    background: #DF6C5E;
    color: white;
    font-weight: 600;
    font-size: 14px;
    border-radius: 4px;
    display: inline-block;
    padding: 4px 8px;
    margin-right: 10px;
    margin-bottom: 10px;
    white-space: nowrap;
    line-height: 1.2rem;
    cursor: pointer;
}
.item-tags span:last-child {
    margin-right: 0px;
}
.item-tags span:hover {
    background: #B95049;
}
.item-tags span:active {
    opacity: 0.7;
}
.item-status table tbody:before,
.item-copies table tbody:before {
    content: "@";
    display: block;
    line-height: 5px;
    text-indent: -99999px;
}
.item-status-display {
    display: inline-block;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    padding: 4px 14px;
    border-radius: 6px;
    background: #efefef;
    color: #666;
    text-transform: capitalize;
    position: relative;
}
.dark .item-status-display {
    background: #2d2d2d;
    color: #ccc;
}
#primary td.item-status-display {
    font-weight: bold;
}
.item-status-display span {
    margin-left: 6px;
    padding: 2px 6px;
    background: #666;
    border-radius: 4px;
    color: #fff;
    font-size: 12px;
    position: relative;
    top: -1px;
}
.dark .item-status-display span,
.dark #primary .item-status-display span {
    color: #1b1b1b;
}
#item-details-view .item-status-display span {
    margin-left: 10px;
    font-size: 14px;
    top: -2px;
}
@media screen and (max-width: 63.9375em) {
	#item-details-view .item-status-display span {
        top: 0px;
    }
}
.summary .item-status-display {
    font-size: 14px;
    padding: 4px 8px;
}
tr.show-status td {
    padding: 5px;
}
#primary td .item-status-display {
    font-size: 14px;
}
.item-status-display.completed,
#primary td .item-status-display.completed {
    color: #4aaf79;
    background: #e2fbee;
}
.dark .item-status-display.completed,
.dark #primary td .item-status-display.completed {
    background: #2b312e;
}
.item-status-display.completed span,
#primary td .item-status-display.completed span {
    background: #4AAF79;
}
.item-status-display.in-progress,
#primary td .item-status-display.in-progress {
    background: #fff2d7;
    color: #d4a440;
}
.dark .item-status-display.in-progress,
.dark #primary td .item-status-display.in-progress {
    background: #312f29;
}
.item-status-display.in-progress span,
#primary td .item-status-display.in-progress span {
    background: #d4a440;
}
.item-status-display.abandoned,
#primary td .item-status-display.abandoned {
    background: #ffe0e0;
    color: #DF6C5E;
}
.dark .item-status-display.abandoned,
.dark #primary  td .item-status-display.abandoned {
    background: #352F31;
}
.item-status-display.abandoned span,
#primary td .item-status-display.abandoned span {
    background: #DF6C5E;
}
@media screen and (max-width: 39.9375em) {
    .summary .item-status-display {
        font-size: 12px;
        padding: 3px 6px;
    }
    .item-status-display span {
        padding: 2px 5px;
        font-size: 10px;
    }
}
.cover .cover-wrapper::before,
.cover .cover-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-color: transparent;
    border-style: solid;
}
.cover .cover-wrapper::after {
    border-radius: 3px 0px 0px 0px;
    border-width: 1.25em;
    border-left-color: transparent;
    border-top-color: transparent;
}
.cover .not-begun.cover-wrapper::after {
    border-left-color: #efefef;
    border-top-color: #efefef;
}
.cover .in-progress.cover-wrapper::after {
    border-left-color: #fff2d7;
    border-top-color: #fff2d7;
}
.cover .completed.cover-wrapper::after {
    border-left-color: #e2fbee;
    border-top-color: #e2fbee;
}
.cover .abandoned.cover-wrapper::after {
    border-left-color: #ffe0e0;
    border-top-color: #ffe0e0;
}
.cover .cover-wrapper span.media-type,
.summary .cover-wrapper span.media-type {
    position: absolute;
    bottom: 1px;
    left: 5px;
    height: 30px;
    width: 30px;
    background-position: left center;
    background-repeat: no-repeat;
    -webkit-filter: drop-shadow( 0px 2px 2px rgba(0, 0, 0, .5));
    filter: drop-shadow( 0px 2px 2px rgba(0, 0, 0, .5));
    opacity: 0.7;
    transition: opacity 0.3s ease-in-out;
}
.cover .cover-wrapper:hover span.media-type,
.cover .cover-wrapper.selected span.media-type,
.summary .cover-wrapper:hover span.media-type,
.summary .cover-wrapper.selected span.media-type {
    opacity: 1;
}
/* .list span.media-type {
    height: 20px;
    width: 30px;
    background-position: left center;
    background-repeat: no-repeat;
    display: inline-block;
    margin-right: 0px;
    opacity: 0.7;
} */
.cover.book .cover-wrapper span.media-type,
.summary.book .cover-wrapper span.media-type {
    background-image: url(/img/library/media-icons/icon-book.svg);
    background-size: 15px auto;
}
/* .list.book span.media-type {
    background-image: url(/img/library/media-icons/icon-book-dark.svg);
    background-size: 14px auto;
    background-position: left center;
} */
.cover.movie .cover-wrapper span.media-type,
.summary.movie .cover-wrapper span.media-type {
    background-image: url(/img/library/media-icons/icon-movie.svg);
    background-size: 24px auto;
}
/* .list.movie span.media-type {
    background-image: url(/img/library/media-icons/icon-movie-dark.svg);
    background-size: 20px auto;
    background-position: left center;
} */
.cover.music .cover-wrapper span.media-type,
.summary.music .cover-wrapper span.media-type {
    background-image: url(/img/library/media-icons/icon-music.svg);
    background-size: 26px auto;
    background-position: left -3px center;
}
/* .list.music span.media-type {
    background-image: url(/img/library/media-icons/icon-music-dark.svg);
    background-size: 24px auto;
    background-position: left center;
} */
.cover.videogame .cover-wrapper span.media-type,
.summary.videogame .cover-wrapper span.media-type {
    background-image: url(/img/library/media-icons/icon-video-game.svg);
    background-size: 29px auto;
}
/* .list.videogame span.media-type {
    background-image: url(/img/library/media-icons/icon-video-game-dark.svg);
    background-size: 24px auto;
} */
.cover.boardgame .cover-wrapper span.media-type,
.summary.boardgame .cover-wrapper span.media-type {
    background-image: url(/img/library/media-icons/icon-board-game.svg);
    background-size: 17px auto;
    bottom: 3px;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    left: -9px;
}
/* .list.boardgame span.media-type {
    background-image: url(/img/library/media-icons/icon-board-game-dark.svg);
    background-size: 25px auto;
} */
@media screen and (max-width: 63.9375em) {
    #item-details-view {
        top: 100%;
        bottom: 60px;
        left: 0px;
        right: 0px;
        width: 100%;
        padding-top: 40px;
        box-shadow: none;
        padding-bottom: 60px;
        box-shadow: 0px -10px 60px rgba(0,0,0,0.1);
    }
    .dark #item-details-view {
        box-shadow: 10px -10px 60px rgba(0,0,0,0.7);
    }
    #edit-item-details {
        top: 100%;
        left: 0px;
        right: 0px;
        width: 100%;
        bottom: 60px;
        box-shadow: 0px -10px 60px rgba(0,0,0,0.1);
    }
    .dark #edit-item-details {
        box-shadow: 0px -10px 60px rgba(0,0,0,0.7);
    }
    #check-in-mode-view.open,
    #item-details-view.open {
        width: 100%;
        left: 0px;
        top: 61px;
        bottom: 0px;
        right: 0px;
        padding-bottom: 120px;
        box-shadow: none;
    }
    #edit-item-details.open {
        top: 61px;
        bottom: 60px;
        left: 0px;
        right: 0px;
        width: 100%;
        box-shadow: none;
    }
    .check-in-mode-header,
    .item-header {
        top: auto;
        bottom: -60px;
        left: 0px;
        right: 0px;
    }
    #check-in-mode-view.open .item-header,
    #item-details-view.open .item-header {
        bottom: 0px;
        top: auto;
        left: 0px;
        right: 0px;
    }

    .item-header ul.item-edit-menu-wrapper {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-left: 0px;
    }
    .check-in-mode-header .close,
    .item-header .close {
        background-color: #fff;
        position: fixed;
        top: 84px;
        right: 23px;
    }
    .item-header .item-flag-button {
        position: fixed;
        top: 130px;
        right: 23px;
        background-color: #fff;
    }
    .dark .check-in-mode-header .close,
    .dark .item-header .close {
        background-color: #1b1b1b;
    }
    .dark .item-header .item-flag-button {
        background-color: #1b1b1b;
    }
    #item-details-view .summary-left-col {
        width: 100%;
        margin-right: 0px;
    }
    #item-details-view .summary-right-col {
        width: 100%;
        float: none;
        clear: both;
        padding-top: 30px;
    }
    #item-details-view .cover-wrapper {
        width: 200px;
        float: left;
        margin-right: 40px;
        height: auto;
        transition: height 3s ease-in-out;
    }
    .show-mobile {
        display: block !important;
    }
    .hide-mobile {
        display: none !important;
    }
    .item-library.show-mobile, .item-group.show-mobile {
        display: inline-block !important;
    }
    #item-details-view .item-title {
        font-size: 28px;
        padding-top: 20px;
    }
    #item-details-view .item-author {
        font-size: 20px;
        margin-bottom: 0px;
    }
    #item-details-view .rating {
        display: inline-block;
        margin-left: 20px;
        text-align: left;
    }
    #item-details-view .star-rating {
        margin-top: 25px;
    }
    #item-details-view .item-status-wrapper {
        text-align: left;
    }
    .item-status-display {
        font-size: 14px;
        padding: 6px 10px;
    }
    .media-tag.show-mobile {
        display: inline-block !important;
    }
}
@media screen and (max-width: 39.9375em) {
    #item-details-view {
        padding: 20px;
    }
    #edit-item-details {
        padding: 20px;
    }
    .item-edit-menu-wrapper {
        top: 3px;
    }
	.item-edit-menu-wrapper li {
        margin-right: 0px;
        width: 20%;
        text-align: center;
    }
    body .item-edit-menu-wrapper li button,
    body .item-edit-menu-wrapper li a {
        padding: 30px 20px 10px 20px;
        background-position: top 7px center;
        font-size: 13px;
        text-align: center;
    }
    body .item-edit-menu-wrapper li button.item-user-details-button,
    body .item-edit-menu-wrapper li a.item-user-details-button {
        background-position: top 5px center;
    }
    body .item-edit-menu-wrapper li button.item-move-button,
    body .item-edit-menu-wrapper li a.item-move-button {
        background-position: top 9px center;
    }
    body .item-edit-menu-wrapper button.item-flag-button,
    body .item-edit-menu-wrapper a.item-flag-button {
        background-position: top 6px center;
    }
    .check-in-mode-header,
    .item-header .close {
        background-color: #fff;
        position: fixed;
        top: 80px;
        right: 10px;
    }
    .item-header .item-flag-button {
        background-color: #fff;
        position: fixed;
        top: 126px;
        right: 10px;
    }
    .dark .item-header .item-flag-button {
        background-color: #1b1b1b;
    }
    #item-details-view .cover-wrapper {
        width: 150px;
        float: left;
        margin-right: 40px;
    }
    #item-details-view .item-title {
        font-size: 24px;
        padding-top: 20px;
    }
    #item-details-view .item-author {
        font-size: 16px;
        margin-bottom: 0px;
    }
    .item-library, .item-group {
        font-size: 18px;
        background-size: 18px auto;
        margin-right: 20px;
    }
    .item-group {
        margin-right: none;
    }
    #item-details-view .summary-right-col {
        padding-top: 20px;
    }
    #item-details-view .star-rating {
        margin-top: 10px;
    }
}
@media screen and (max-width: 499px) {
    #item-details-view .cover-wrapper {
        width: 175px;
        max-width: 100%;
        float: none;
        margin-right: 0px;
        text-align: left;
        margin-bottom: 30px;
    }
}

/* SEARCH PAGE */
#search-container #item-summary-wrapper {
    clear: both;
}
#search-container .item.summary {
    margin: 15px 0px;
    width: calc(50% - 15px);
    left: 0px;
}
@media screen and (min-width: 1800px) {
    #search-container .item.summary:nth-child(odd) {
        margin-right: 15px;
    }
    #search-container .item.summary:nth-child(even) {
        margin-left: 15px;
    }
}
@media screen and (min-width: 2300px) {
	#search-container .item.summary {
        width: calc(33.33333333% - 20px);
        margin: 15px 0px;
    }
    #search-container .item.summary:nth-child(odd) {
        margin-right: 30px;
    }
    #search-container .item.summary:nth-child(even) {
        margin-left: 0px;
        margin-right: 30px;
    }
    #search-container .item.summary {
        margin-right: 30px;
    }
    #search-container .item.summary:nth-child(3n) {
        margin-right: 0px;
        margin-left: 0px;
    }
}
@media screen and (min-width: 3400px) {
	#search-container .item.summary {
        width: calc(25% - 23px);
        margin: 15px 0px;
    }
    #search-container .item.summary:nth-child(odd) {
        margin-right: 30px;
    }
    #search-container .item.summary:nth-child(even) {
        margin-left: 0px;
        margin-right: 30px;
    }
    #search-container .item.summary {
        margin-right: 30px;
    }
    #search-container .item.summary:nth-child(4n) {
        margin-right: 0px;
        margin-left: 0px;
    }
}
#search-container .item.summary .item-title {
    margin-top: 10px;
}
#patron-page .item-library,
#search-container .item-library {
    color: #03151E;
    background-size: 20px auto;
    font-size: 18px;
}
.dark #patron-page .item-library,
.dark #search-container .item-library {
    color: #fff;
}
@media screen and (max-width: 1800px) {
    #search-container .item.summary {
        width: 100%;
    }
}
#search-info {
    position: relative;
    margin-top: 20px;
    margin-left: 25px;
}
@media screen and (max-width: 39.9375em) {
	#search-info {
        margin-left: 0px;
    }
}
.no-results-text {
    font-size: 32px;
    text-align: center;
    margin-top: 100px;
}
#search-info #search-sort-filter,
#search-info #view-filters {
    float: right;
    top: 0px;
}
#search-total-results {
    top: 0px;
    position: relative;
    display: inline-block;
    margin-left: 10px;
}
.search-back {
    margin-top: 15px;
}
@media screen and (max-width: 63.9375em) {
    #search-info {
        margin-top: 0px;
    }

    #check-in-mode-view.open .check-in-mode-header {
      left: 0px;
      top: -65px;
    }
}
@media screen and (max-width: 39.9375em) {
    #search-container .item.summary {
        left: 0px;
    }
	#search-total-results {
        float: none;
        top: 0px;
        margin-bottom: 10px;
    }
    #search-info #search-sort-filter {
        float: left;
    }
    #search-info #search-sort-filter select#search-sort {
        margin-left: 0px;
    }
    #search-info #view-filters {
        top: 6px;
    }
}

/* BATCH EDIT PANEL */
#primary.batch-edit-open {
    padding-bottom: 300px;
}
#batch-edit-panel {
    background: rgba(255,255,255,0.9);
    -webkit-backdrop-filter: blur(40px) saturate(200%);
    backdrop-filter: blur(40px) saturate(200%);
    height: auto;
    position: fixed;
    bottom: -100%;
    left: 235px;
    right: 0px;
    padding: 20px 50px 30px;
    box-shadow: 0px -6px 16px -10px rgb(0 0 0 / 30%);
    transition: all 0.3s ease-in-out;
    z-index: 1012;
}
.dark #batch-edit-panel {
    background: rgba(27,27,27, 0.9);
    box-shadow: 0px -6px 16px -10px rgba(0 0 0 / 70%);
}
@-moz-document url-prefix() {
    #batch-edit-panel {
        background-color: #fff;
    }
    .dark #batch-edit-panel {
        background-color: #1b1b1b;
    }
}
#batch-edit-panel.open {
    bottom: 0px;
}
.filter-open #batch-edit-panel {
    right: 260px;
}
#batch-edit-panel label {
    margin-bottom: 10px;
}
#batch-actions li {
    margin-right: 10px;
    margin-bottom: 10px;
}
#batch-actions button.button {
    padding: 10px 20px;
    -webkit-transition: background-position 0.3s ease-in-out, padding-right 0.2s;
    transition: background-position 0.3s ease-in-out, padding-right 0.2s;
    font-size: 14px;
}
span.batch-being-processed:empty {
    display: none;
}
span.batch-being-processed {
    margin-left: 10px;
    font-size: 13px;
    color: #404040;
    display: inline-block;
    position: relative;
    font-weight: bold;
    border: 1px solid #bbb;
    border-radius: 5px;
    padding: 3px 6px;
    line-height: 1em;
    top: -3px;
}
.dark span.batch-being-processed {
    color: #fff;
}
.dark #batch-edit-panel button.button:focus {
    color: #fff;
    background-color: #38393A;
}
#batch-edit-panel button.button:hover {
    background-color: #dedede;
    color: #03151E;
}
.dark #batch-edit-panel button.button:hover {
    color: #fff;
    background-color: #101010;
}
#batch-edit-panel button.button.active:focus,
#batch-edit-panel button.button.active {
    color: #fff;
    background-color: #4BC1D2;
}
.dark #batch-edit-panel button.button.active:focus,
.dark #batch-edit-panel button.button.active {
    background-color: #0096B5;
}
#batch-edit-panel button.button.delete {
    padding: 10px 20px 10px 30px;
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #DF6C5E;
    background-size: 10px auto;
    color: #fff;
    font-weight: normal;
}
.dark #batch-edit-panel button.button.delete{
    padding: 10px 20px 10px 30px;
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #DF6C5E;
    background-size: 10px auto;
    color: #fff;
}
#batch-delete-submit {
    font-weight: normal;
}
#batch-edit-panel button.button.delete:hover {
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #EC7D78;
    background-size: 10px;
    color: #fff;
}
.dark #batch-edit-panel button.button.delete:hover,
.dark #batch-edit-panel button.button.delete.active {
    padding: 10px 20px 10px 30px;
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #B95049;
    background-size: 10px auto;
    color: #fff;
    opacity: 0.8;
}

#batch-edit-panel button.button.delete.active {
    padding: 10px 20px 10px 30px;
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #EC7D78;
    background-size: 10px auto;
    color: #fff;
    background-color: #EC7D78;
}
#batch-edit-panel button.button:focus {
    color: #03151E;
    background-color: #ececec;
}
#batch-edit-panel button#batch-delete-submit.button:focus {
  color: #FFF;
  background-color: #df6c5e;
}
#batch-edit-panel .batch-submit-wrapper button {
    background-color: #4BC1D2;
    color: #fff;
}
#batch-edit-panel .batch-submit-wrapper button:hover {
    background-color: #0096B5;
    color: #fff;
}
#batch-edit-panel .batch-submit-wrapper button:active {
    background-color: #4BC1D2;
    color: #fff;
}
#batch-edit-panel .batch-submit-wrapper button:focus {
    background-color: #4BC1D2;
    color: #fff;
}

.dark #batch-edit-panel .batch-submit-wrapper button {
    background-color: #0096B5;
    color: #fff;
}
.dark #batch-edit-panel .batch-submit-wrapper button:hover {
    background-color: #007c96;
    color: #fff;
}
.dark #batch-edit-panel .batch-submit-wrapper button:active {
    background-color: #0096B5;
    color: #fff;
}
.dark #batch-edit-panel .batch-submit-wrapper button:focus {
    background-color: #0096B5;
    color: #fff;
}
.batch-action {
    display: none;
}
.grid-container.full.batch-action {
    padding-top: 30px;
    margin-top: 20px;
    border-top: 1px solid #ececec;
}
.dark .grid-container.full.batch-action {
    border-top: 1px solid #282828;
}
#batch-delete-view.open,
#batch-price-view.open,
#batch-status-view.open,
#batch-move-view.open,
#batch-group-view.open,
#batch-notes-view.open,
#batch-call-view.open,
#batch-tags-view.open {
    display: block;
}
@media screen and (max-width: 63.9375em) {
    .filter-open #batch-edit-panel {
        right: 0px;
    }
	#batch-edit-panel {
        left: 0px;
    }
    #batch-actions button.button {
        padding: 10px;
    }
}
@media screen and (max-width: 39.9375em) {
	#batch-edit-panel {
        padding: 20px;
    }
    .tiny-tabs button {
        margin-bottom: 10px;
    }
}
/* END BATCH EDIT PANEL */

/* SETTINGS PAGE */
.accordion .disabled {
  background-color: #eaeaea;
  opacity: 0.5;
}
.dark .accordion .disabled {
    background-color: transparent;
}
.dark .disabled .accordion-title {
    background: #333;
}
  .accordion .disabled a {
    cursor: not-allowed;
  }
  .accordion .disabled .accordion-title::before {
    background: none;
  }

/* END SETTINGS PAGE */



/* REPORTS PAGE */
.report-csv {
  cursor: pointer;
  margin-bottom: 10px;
  border: 1px solid #ececec;
  border-radius: 6px;
  min-height: 112px;
  position: relative;
  transition: all 0.3s ease-in-out;
}
.report-csv:hover {
    box-shadow: 0px 8px 16px -10px rgba(0,0,0, 0.3);
}
.report-title {
    padding: 15px 100px 0px 15px;
    border-radius: 7px 7px 0px 0px;
    font-weight: bold;
    font-size: 14px;
}
.report-description, .report-breakdown {
    font-size: 12px;
    padding: 10px 120px 0px 15px;
    color: #666;
}
.report-breakdown {
    font-style: italic;
    padding-bottom: 10px;
    padding-top: 0px;
}
span.reports-icon {
    background: url(/img/library/icons/icon-csv-blue.svg) no-repeat center center;
    background-size: 40px auto;
    position: absolute;
    background-color: #EAF3F4;
    right: 0px;
    top: 0px;
    bottom: 0px;
    width: 100px;
    border-radius: 0px 6px 6px 0px;
}
.dark .reports-title {
    color: #fff;
}
.dark .report-csv {
    border: 1px solid #282828;
}
.dark .report-csv:hover {
    box-shadow: 0px 8px 16px -10px rgba(0,0,0, 0.7);
}
.dark .report-description,
.dark .report-breakdown {
    color: #ccc;
}
.dark span.reports-icon {
    background: url(/img/library/icons/icon-csv-blue.svg) no-repeat center center;
    background-size: 40px auto;
    background-color: #282828;
}
.reports-disabled .report-csv,
.reports-disabled .report-breakdown,
.reports-disabled .report-description {
    color: #ccc;
    cursor: not-allowed;
}
.dark .reports-disabled .report-csv,
.dark .reports-disabled .report-breakdown,
.dark .reports-disabled .report-description {
    color: #404040;
}
.reports-disabled .report-csv:hover {
    box-shadow: none;
}
.reports-disabled span.reports-icon {
    background: url(/img/library/icons/icon-csv-disabled.svg) no-repeat center center;
    background-size: 40px auto;
    background-color: #f6f6f6;
}
.dark .reports-disabled span.reports-icon {
    background: url(/img/library/icons/icon-csv-disabled-dark.svg) no-repeat center center;
    background-size: 40px auto;
    background-color: #282828;
}
.reports-disabled .report-csv.report-ignore-date .report-title {
    color: #03151E;
}
.reports-disabled .report-csv.report-ignore-date,
.reports-disabled .report-ignore-date .report-breakdown,
.reports-disabled .report-ignore-date .report-description  {
    color: #666;
    cursor: pointer;
}
.reports-disabled .report-csv.report-ignore-date:hover {
    box-shadow: 0px 8px 16px -10px rgba(0,0,0, 0.3);
}
.dark .reports-disabled .report-csv.report-ignore-date:hover {
    box-shadow: 0px 8px 16px -10px rgba(0,0,0, 0.7);
}
.reports-disabled .report-ignore-date span.reports-icon {
    background: url(/img/library/icons/icon-csv-blue.svg) no-repeat center center;
    background-size: 40px auto;
    background-color: #EAF3F4;
}
.dark .reports-disabled .report-ignore-date span.reports-icon {
    background: url(/img/library/icons/icon-csv-blue.svg) no-repeat center center;
    background-size: 40px auto;
    background-color: #282828;
}
.dark .reports-disabled .report-csv.report-ignore-date .report-title {
    color: #fff;
}
.dark .reports-disabled .report-ignore-date .report-description,
.dark .reports-disabled .report-ignore-date .report-breakdown {
    color: #ccc;
}
/* END REPORTS PAGE */


/* DASHBOARDS PAGE */
#dashboards .cell {
  margin-bottom: 25px;
}
#dashboards .position-bottom {
  bottom: inherit;
  left: inherit;
  width: auto;
  overflow-x: auto;
  height: auto;
  -webkit-transform: inherit;
      -ms-transform: inherit;
          transform: inherit;
}
.text-viz span {
  font-size: 32px;
  font-weight: bold;
}
.dash-border {
    border: 2px solid #ececec;
    border-radius: 10px;
    padding: 15px;
}
.dark .dash-border {
    border: 2px solid #282828;
}
.dash-border:empty {
  display: none;
}
select#dashboard-library-select {
    font-size: 20px;
    height: 50px;
}
/* .vertical-bar  .apexcharts-series path {
    clip-path: inset(0% 0% -11% 0% round 10px);
}
.small-vertical-bar .apexcharts-series path {
    clip-path: inset(0% 0% -11% 0% round 5px);
}
.horizontal-bar .apexcharts-series path {
    clip-path: inset(0% 0% 0% -5% round 5px);
} */
.dark .apexcharts-canvas text {
    fill: #ccc;
}
/* .apexcharts-treemap-series rect {
    clip-path: inset(1px 1px 1px 1px round 8px);
} */
.dark .apexcharts-gridlines-horizontal line {
    stroke: #333;
}
body .apexcharts-menu-icon svg {
    fill: #03151E;
}
.dark .apexcharts-menu-icon svg {
    fill: #fff;
}
body .apexcharts-menu {
    border-radius: 5px;
}
.dark .apexcharts-menu {
    background: #282828;
    border: 1px solid #282828;
}
.apexcharts-menu-item {
    text-align: center;
}
.dark .apexcharts-theme-light .apexcharts-menu-item:hover {
    background: #131313;
}
.dark .apexcharts-legend-text {
    color: #fff !important;
}
.dark  .apexcharts-treemap-series rect {
    stroke: #1B1B1B;
}
.dark .apexcharts-tooltip.apexcharts-theme-light {
    color: #fff;
    background: rgba(30,30,30, 0.95);
    border: #333;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.7);
}
.dark .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
    background: rgba(0,0,0,0.7);
    border-bottom: 1px solid #333;
}
/* END DASHBOARDS PAGE */


/* CHECKOUTS AND HOLD PAGE */
  table.dataTable.stripe tbody tr.odd.past-due,
  table.dataTable.display tbody tr.odd.past-due,
  table.dataTable.stripe tbody tr.even.past-due,
  table.dataTable.display tbody tr.even.past-due {
    background-color: #EC7D78;
  }

  #current-holds .dataTables_wrapper .dataTables_filter input,
  #current-checkouts .dataTables_wrapper .dataTables_filter input {
    z-index: 20;
    position: relative;
  }

  #holds-table .holds-item-image,
  #checkouts-table .checkouts-item-image {
    white-space: nowrap;
    min-width: 50px;
    text-align: center;
  }

  /* DATE PICKER */

  #holds-litepicker-container,
  #checkouts-litepicker-container {
    display: none;
    position: relative;
    margin-bottom: -55px;
    z-index: 10;
  }
  body .litepicker .container__footer {
      border-bottom: 1px solid #dedede;
      box-shadow: inset 0px 3px 3px 0px #ddd, 0px 15px 10px -5px rgba(0,0,0,0.2);
  }
 .litepicker .container__footer .preview-date-range {
   font-size: 65%;
 }

 #holds-date-range-help,
 #checkouts-date-range-help {
   margin-bottom: 0px;
 }
  @media screen and (max-width: 39.9375em) {
    #holds-litepicker-container,
    #checkouts-litepicker-container {
      margin-bottom: 0px;
    }
  }
  #litepicker {
    padding-left: 35px;
    background-image: url(/img/library/datatables/calendar.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 15px auto;
}
body .litepicker .container__footer .button-cancel {
    background-color: #EFEFEF;
    border: 1px solid #EFEFEF;
    color: #404040;
    font-weight: bold;
}
body.dark .litepicker .container__footer .button-cancel {
    background-color: #404040;
    border: 1px solid #404040;
    color: #fff;
}
body .litepicker .container__footer .button-apply {
    background-color: #4BC1D2;
    font-weight: bold;
}
.dark .litepicker .container__months,
.dark .litepicker .container__months .month-item-header {
    background: #1b1b1b;
    color: white;
}
.dark .litepicker .container__months {
    box-shadow: 0px 0px 5px rgba(0,0,0,0.8);
}
.dark .litepicker .container__footer {
    background-color: #131313;
    border-bottom: 1px solid #131313;
    box-shadow: inset 0px 3px 3px 0px rgba(0,0,0,0.8), 0px 15px 10px -5px rgba(0,0,0,0.4);
    color: white;
}
body .litepicker .container__days .day-item.is-today {
    color: #0096B5;
}
.dark .litepicker .container__days .day-item {
    color: white;
}
body .litepicker .container__days .day-item.is-start-date,
body .litepicker .container__days .day-item.is-end-date {
    background-color: #0096B5;
}
body .litepicker .container__days .day-item.is-in-range {
    background: #4BC1D2;
}
body .litepicker .container__days .day-item:hover {
    color: #0096B5;
    box-shadow: inset 0 0 0 1px #0096B5;
}

/* END CHECKOUTS AND HOLD PAGE */


/* BILLING PAGE */
.dark #plan-pricing-display {
    border: none;
    background: #282828;
}
.dark #register-number-of-managers {
    background: #131313;
    box-shadow: none;
    border: none;
}
.dark #billing-subscription #plan-pricing-display {
    border: none;
}
#billing-change-plan-wrapper {
  text-align: center;
}
.billing-legacy {
  margin-bottom: 40px;
}
.billing-legacy div {
  margin-bottom: 20px;
}
input#billing-ack {
  margin: 0;
}
.pro {
    font-size: 20px;
    margin-top: 20px;
    padding: 20px;
    /* border: 1px solid #BAD8E2; */
    border-bottom: none;
    background: #4BC1D2;
    color: white;
    border-radius: 8px 8px 0px 0px;
}
.dark .pro {
    background: #0096B5;
}
.pro span {
    font-size: 24px;
}
label.large-label.edit-card-label {
    margin-top: 0px;
    padding-left: 50px;
    background: url(/img/library/icons/icon-edit-card.svg) no-repeat left center;
    background-size: 35px auto;
}
.dark label.large-label.edit-card-label {
    background: url(/img/library/icons/icon-edit-card-white.svg) no-repeat left center;
    background-size: 35px auto;
}
.card-brand {
    padding-left: 45px;
    background: url(/img/library/icons/icon-edit-card.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.dark .card-brand {
    padding-left: 45px;
    background: url(/img/library/icons/icon-edit-card-white.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand.mastercard {
    background: url(/img/library/icons/icon-mastercard.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand.visa {
    background: url(/img/library/icons/icon-visa.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand.discover {
    background: url(/img/library/icons/icon-discover.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand.american,
.card-brand.amex {
    background: url(/img/library/icons/icon-amex.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand.paypal {
    background: url(/img/library/icons/icon-paypal.svg) no-repeat left 10px center;
    background-size: 25px auto;
}
.card-brand span {
    font-weight: bold;
}
.card-ending {
    font-size: 12px;
    padding: 2px 5px;
    display: inline-block;
    border: 1px solid #404040;
    border-radius: 4px;
}
.receipt {
    padding-left: 22px;
    background: url(/img/library/icons/icon-receipt.svg) no-repeat left center;
    background-size: 14px auto;
}
.payment-amount {
    display: inline-block;
    padding: 2px 8px;
    border: 1px solid #dedede;
    border-radius: 4px;
}
.dark .payment-amount {
    border: 1px solid #404040;
}
.refunded {
    background: #eaeaea;
    border: 1px solid #CCC;
}

/* END BILLING PAGE */

/* LENDING PAGE */
#patron-container,
#lending-item-container {
  position: relative;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	#patron-container button#hold,
    #patron-container button#checkout {
        font-size: 13px;
    }
}
#lending-item-container label,
#patron-container label {
    font-size: 16px;
}
#lending-search,
#lending-patron {
    border: 1px solid #dedede;
    border-radius: 6px;
    padding: 5px 15px;
    background-color: transparent;
    padding-right: 30px;
    background-image: url(/img/library/icons/icon-search-gray.svg);
    background-repeat: no-repeat;
    background-size: 15px auto;
    background-position: right 15px center;
    transition: all 0.2s ease-in-out;
    -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
}
#lending-search:focus,
#lending-patron:focus {
    border: 1px solid #dedede;
    border-top: 1px solid #f6f6f6;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1), 0px 8px 16px -10px rgba(0,0,0,0.3);
    background-color: #f9f9f9;
}

#lending-dates {
    color: #666;
    background: url(/img/library/datatables/calendar.svg) no-repeat left center;
    background-size: 18px auto;
    padding-left: 28px;
}
#lending-dates span#checked-out,
#lending-dates span#due-date {
    display: inline-block;
    padding: 0px 6px;
    border: 1px solid #dedede;
    color: #404040;
    border-radius: 4px;
    margin-right: 10px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}
.dark #lending-search,
.dark #lending-patron,
.dark #lending-dates span#checked-out,
.dark #lending-dates span#due-date {
    background-color: #131313;
    border: 1px solid #232323;
}
.dark #lending-dates span#checked-out,
.dark #lending-dates span#due-date {
    color: #ccc;
}
#lending-dates span#check-in {
    margin-right: 0px;
}
#lending-dates span#checked-out:hover,
#lending-dates span#due-date:hover {
    background-color: #efefef;
    color: #03151E;
}
.dark #lending-dates span#checked-out:hover,
.dark #lending-dates span#due-date:hover {
    background-color: #101010;
    color: white;
}
.dark #lending-dates span#checked-out:focus,
.dark #lending-dates span#due-date:focus {
    background-color: #101010;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    #lending-dates {
        margin-bottom: 20px;
        text-align: right;
        background-position: left 23px center;
    }
    #lending-dates span#checked-out, #lending-dates span#due-date {
        margin-right: 0px;
    }
    #lending-due-date-label {
        display: inline-block;
    }
}
@media screen and (max-width: 39.9375em) {
    #lending-dates {
        margin-bottom: 20px;
        margin-left: 5px;
        text-align: left;
        background-position: left center;
        font-size: 13px;
    }
	#lending-due-date-label {
        display: inline-block;
    }
    #lending-dates span#checked-out, #lending-dates span#due-date {
        margin-right: 0px;
    }
}
.dark #lending-search:focus,
.dark #lending-patron:focus {
    border: 1px solid #232323;
    border-top: 1px solid #131313;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.7), 0px 8px 16px -10px rgba(0,0,0,0.8);
    background-color: #101010;
}
.dark .dtpicker-content,
.dark .dtpicker-components .dtpicker-compButton {
    background: #282828;
}
.dark .dtpicker-content {
    box-shadow: 0px 10px 20px rgba(0,0,0,0.7);
}
.dtpicker-mobile .dtpicker-cont {
    -webkit-transform: none;
    -o-transform: none;
    -moz-transform: none;
    transform: none;
    margin-top: -180px;
}
.dtpicker-mobile .dtpicker-content {
    border-radius: 6px;
    box-shadow: 0px 10px 20px rgba(0,0,0,0.1);
}
.dtpicker-header .dtpicker-value,
.dtpicker-components .dtpicker-comp>* {
    color: #0096B5;
}
.dtpicker-components .dtpicker-compValue,
.dtpicker-components .dtpicker-compValue:hover {
    border: 1px solid #dedede;
    color: #03151E;
    background: white;
}
.dark .dtpicker-components .dtpicker-compValue,
.dark .dtpicker-components .dtpicker-compValue:hover {
    background: #131313;
    border: 1px solid #232323;
    color: white;
}
.dtpicker-components .dtpicker-compValue:focus {
    background: white;
}
.dark .dtpicker-components .dtpicker-compValue:focus {
    background: #010101;
}
.dtpicker-buttonCont .dtpicker-button {
    background: #4BC1D2;
    border-radius: 6px;
    font-weight: 600;
    font-size: 16px;
}
.dtpicker-buttonCont .dtpicker-button:hover {
    opacity: 0.7;
}
.lending-item-result .cover-wrapper img {
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
    /* width: 75px; */
}
#lending-items-queue:empty,
#patron-queue:empty {
    border: none;
    display: none;
}
#lending-items-queue,
#patron-queue {
    margin-top: 20px;
    border-top: 1px solid #dedede;
}
#patron-queue {
    padding: 20px;
    margin-bottom: 20px;
    margin-left: 0px;
    margin-right: 0px;
    background: #f6f6f6;
    border-radius: 6px;
    border-top: none;
}
.lending-patron-data.freeze {
    background: repeating-linear-gradient(
        -45deg,
        #d5e6ed,
        #d5e6ed 10px,
        #d8eaf1 10px,
        #d8eaf1 20px
    );
    margin: -10px -10px;
    padding: 10px 25px;
    width: calc(100% + 20px);
}
.dark .lending-patron-data.freeze {
    background: repeating-linear-gradient(
        -45deg, #123f51, #123f51 10px, #184456 10px, #184456 20px
    );
}
.patron-id-lending {
  font-size: 12px;
  margin-top: 5px;
}
.dark #patron-queue {
    background: #282828;
}
.queue-item {
    padding: 20px 0px;
    border-bottom: 1px solid #dedede;
}
.queue-item img {
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
}
.dark .queue-item {
    border-bottom: 1px solid #282828;
}
.queue-item:last-child {
    border-bottom: none;
}
.dark #lending-items-queue {
    border-top: 1px solid #232323;
}
.lending-barcode,
.patron-barcode {
    padding-left: 30px;
    background-image: url(/img/library/datatables/icon-barcodes.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
    margin-top: 3px;
    margin-left: -4px;
}
.dark .lending-barcode,
.dark .patron-barcode {
    background-image: url(/img/library/datatables/icon-barcodes-white.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
}
.lending-results-actions {
    text-align: right;
}
.lending-patron-data {
    position: relative;
}
.patron-name {
    font-weight: bold;
    padding-right: 85px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.patron-email {
    color: #666;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.dark .patron-email {
    color: #ccc;
}
.patron-search-results-image  {
    display: inline-block;
    position: relative;
    height: 100%;
    width: 70px;
}
.patron-info-wrapper {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 70px);
}
#patron-queue img,
.lending-patron-result img {
    border-radius: 100%;
    position: absolute;
    height: 50px;
    width: 50px;
    top: 50%;
    margin-top: -25px;
}
.patron-active-items-wrapper:empty {
    display: none;
}
.patron-active-items-wrapper {
    padding-left: 27px;
    background: url(/img/library/icons/icon-lending-dark.svg) no-repeat left 1px top 9px;
    background-size: 15px auto;
}
.dark .patron-active-items-wrapper {
    padding-left: 27px;
    background: url(/img/library/icons/icon-lending-dark2.svg) no-repeat left 1px top 9px;
    background-size: 15px auto;
}
.patron-active-items:empty {
    display: none;
}
.patron-active-items {
    display: inline-block;
    font-size: 16px;
    margin-top: 5px;
}
.patron-current-checkouts {
    margin-right: 10px;
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	#patron-queue img,
    .lending-patron-result img {
        width: 40px;
        height: 40px;
        margin-top: -20px;
        margin-left: -7px;
    }
    .patron-search-results-image {
        width: 45px;
    }
    .patron-info-wrapper {
        width: calc(100% - 45px);
    }
    .patron-active-items-wrapper {
        padding-left: 20px;
        background: url(/img/library/icons/icon-lending-dark.svg) no-repeat left 1px top 8px;
        background-size: 14px auto;
    }
    .dark .patron-active-items-wrapper {
        padding-left: 20px;
        background: url(/img/library/icons/icon-lending-dark2.svg) no-repeat left 1px top 8px;
        background-size: 14px auto;
    }
    .patron-active-items {
        font-size: 14px;
    }
}
@media screen and (max-width: 39.9375em) {
}
.patron-edit-button a.button {
    white-space: nowrap;
    padding-left: 20px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 26px;
    font-size: 12px;
    margin-bottom: 0;
    background-image: url(/img/library/datatables/edit.svg);
    background-repeat: no-repeat;
    background-color: #fff;
    background-position: left 5px center;
    background-size: 13px auto;
    position: absolute;
    top: -7px;
    right: 30px;
    border: 1px solid #dedede;
}
.dark .patron-edit-button a.button {
    background-image: url(/img/library/datatables/edit-white.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    border: 1px solid #232323;
}
.patron-edit-button a.button:hover {
    background-color: #fff;
    color: #03151E;
    opacity: 0.7;
}
.dark .patron-edit-button a.button:hover {
    background-color: #101010;
    color: white;
}
.patron-edit-button a.button:active {
    background-image: url(/img/library/datatables/edit.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    color: #03151E;
    background-color: #dedede;
}
.dark .patron-edit-button a.button:active {
    background-image: url(/img/library/datatables/edit-white.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    color: #fff;
    background-color: #080808;
}
.lending-item-result .library-title,
.queue-item .library-title {
    padding-left: 25px;
    background-image: url(/img/library/datatables/icon-libraries-dark.svg);
    background-repeat: no-repeat;
    background-position: left 5px top 4px;
    background-size: 15px auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 5px;
}
.lending-item-result {
    padding-bottom: 10px;
}
.lending-item-result .item-title,
.queue-item .item-title {
    font-weight: bold;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.lending-item-result .item-call-number:empty,
.queue-item .item-call-number:empty {
    display: none;
}
.lending-item-result .item-call-number,
.queue-item .item-call-number {
    padding: 2px 6px;
    border-radius: 4px;
    background: #efefef;
    display: inline-block;
    margin: 3px 0px;
}
.dark .lending-item-result .item-call-number,
.dark .queue-item .item-call-number {
    color: #fff;
    background: #333;
}
.select-barcodes-wrapper {
    display: block;
    padding: 2px 4px;
    border: 1px solid #dedede;
    border-radius: 4px;
    max-height: 68px;
    overflow: auto;
    margin-top: 10px;
    background: white;
}
.select-barcodes-wrapper.one-barcode-item {
    padding: 0px;
    border: none;
    max-height: auto;
    background: transparent;
    margin-top: 0px;
}
.queue-item .select-barcodes-wrapper {
    display: none;
}
.dark .select-barcodes-wrapper {
    background: #131313;
    border: 1px solid #232323;
}
.dark .select-barcodes-wrapper.one-barcode-item {
    padding: 0px;
    border: none;
    max-height: auto;
    background: transparent;
    margin-top: 0px;
}
.select-barcodes-wrapper span {
    font-size: 12px;
    display: inline-block;
    padding: 3px 6px;
    border-radius: 4px;
}
.select-barcodes-wrapper.one-barcode-item span {
    font-size: 14px;
    padding: 0px;
    padding-left: 30px;
    background-image: url(/img/library/datatables/icon-barcodes.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
    margin-top: 3px;
    margin-left: -4px;
}
.dark .select-barcodes-wrapper.one-barcode-item span {
    background-image: url(/img/library/datatables/icon-barcodes.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
}
.dark .select-barcodes-wrapper.one-barcode-item span {
    background-image: url(/img/library/datatables/icon-barcodes-white.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
}
.select-barcodes-wrapper span:hover {
    background-color: #4BC1D2;
    color: white;
}
.select-barcodes-wrapper.one-barcode-item span:hover {
    background-color: inherit;
    color: inherit;
}
.lending-item-result .item-creators,
.queue-item .item-creators {
    color: #8a8a8a;
}
.lending-results-checked-out-table,
.lending-results-holds-table {
    margin-top: 10px;
    margin-bottom: 0px;
}
.lending-results-checked-out-table th,
.lending-results-holds-table th {
    padding: 3px 5px;
    text-align: left;
    font-size: 10px;
    text-transform: uppercase;
    color: #8a8a8a;
}
#primary .lending-results-checked-out-table td,
#primary .lending-results-holds-table td {
    padding: 3px 5px;
    font-size: 12px;
}
.barcode-icon {
    width: 20px;
    height: 12px;
    display: inline-block;
    position: relative;
    top: 2px;
    background: url('/img/library/datatables/icon-barcodes.svg') no-repeat center center;
    background-size: 20px auto;
}
.dark .barcode-icon {
    width: 20px;
    height: 12px;
    display: inline-block;
    position: relative;
    top: 2px;
    background: url('/img/library/datatables/icon-barcodes-white.svg') no-repeat center center;
    background-size: 20px auto;
}
.holds-on-all-available-copies:after {
    content: "On Hold";
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 14px;
    color: #8a8a8a;
    font-weight: 900;
    display: inline-block;
    padding: 10px;
    text-transform: uppercase;
}
.unavailable:after,
.unavialable.holds-on-all-available-copies:after {
    content: "Unavailable";
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 14px;
    color: #8a8a8a;
    font-weight: 900;
    display: inline-block;
    padding: 10px;
    text-transform: uppercase;
}
#patron-search-results,
#lending-search-results {
  position: absolute;
  display: none;
  background-color: #FFFFFF;
  width: 100%;
  padding: 0;
  border-radius: 4px;
  border: 1px solid #dedede;
  margin-top: 0;
  z-index: 2;
  box-shadow: 0 3px 8px rgba(0,0,0,0.1);
  max-height: 600px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.dark #patron-search-results,
.dark #lending-search-results {
    background: #131313;
    border: 1px solid #232323;
    box-shadow: 0 3px 8px rgba(0,0,0,0.7);
}
  #patron-search-results .close,
  #lending-search-results .close {
    display: none;
  }
.patron-edit-button {
  display: none;
}
#checkout-hold-container {
  display: none;
}
.lending-patron-result,
.lending-item-result {
  margin:inherit;
  padding-top: 10px;
  cursor: pointer;
  border-bottom: 1px solid #dedede;
  position: relative;
}
.lending-patron-result {
    padding: 10px;
}
.dark .lending-patron-result,
.dark .lending-item-result {
    border-bottom: 1px solid #232323;
}
  .lending-patron-result.active,
  .lending-item-result.active {
    background-color: #f6f6f6;
  }
  .dark .lending-patron-result.active,
  .dark .lending-item-result.active {
    background-color: #101010;
  }
  .lending-item-result .barcode-display {
    display: none;
  }
#patron-queue .cell,
#lending-items-queue .cell {
  position: relative;
}
#patron-queue .close,
#lending-items-queue .close {
  background: url(/img/library/icons/icon-close.svg) no-repeat center center;
  background-size: 20px auto;
  height: 35px;
  width: 35px;
  position: absolute;
  right: -10px;
  top: -10px;
  cursor: pointer;
  border-radius: 100%;
  border: 1px solid #dedede;
}
#patron-queue .freeze .close,
#lending-items-queue .freeze .close {
    background-color: #fff;
}
#lending-items-queue .close {
    right: 0px;
    top: -10px;
}
.dark #patron-queue .close,
.dark #lending-items-queue .close {
  background: url(/img/library/icons/icon-close-white.svg) no-repeat center center;
  background-size: 20px auto;
  border: 1px solid #404040;
}
.dark #patron-queue .freeze .close,
.dark #lending-items-queue .freeze .close {
    background-color: #3A3B3C;
    border: 1px solid #1b1b1b;
}
#lending-items-queue .lending-barcodes {
  display: none;
}
@media screen and (max-width: 63.9375em) {
    .patron-name {
        padding-right: 80px;
    }
}
#lending-item-container .batch-select {
    display: none;
}
#patron-table .patron-image .button,
#ultimate-table button.ultimate-edit-account {
  white-space: nowrap;
  padding-left: 25px;
  padding-right: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
  line-height: 26px;
  margin-bottom: 0;
  background-image: url(/img/library/datatables/edit.svg);
  background-repeat: no-repeat;
  background-position: left 5px center;
  background-size: 15px auto;
  background-color: #efefef;
  cursor: pointer;
}
.dark #patron-table .patron-image .button {
    background-image: url(/img/library/datatables/edit-white.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    background-color: #3A3B3C;
}
#patron-table .patron-image .button:active,
#patron-table .patron-image .button:focus,
#ultimate-table button.ultimate-edit-account:active,
#ultimate-table button.ultimate-edit-account:focus {
    white-space: nowrap;
    padding-left: 25px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 26px;
    margin-bottom: 0;
    background-image: url(/img/library/datatables/edit.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    color: #03151E;
    background-color: #ccc;
}
.dark #patron-table .patron-image .button:active,
.dark #patron-table .patron-image .button:focus {
    background-image: url(/img/library/datatables/edit-white.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    color: #fff;
    background-color: #080808;
}
  #patron-table .patron-image .button img {
    max-width: 26px;
    float:left;
    margin-right: 10px;
    border-radius: 13px;
  }
  #patron-table .patron-image {
    white-space: nowrap;
    min-width: 100px;
    text-align: left;
  }

td.patron-image img {
    height: 35px;
    width: 35px;
    border-radius: 100px;
    margin-right: 10px;
}
#primary td.first-name,
#primary td.last-name {
    font-weight: bold;
    min-width: 50px;
}
#primary button.dt-button, #primary div.dt-button, #primary a.dt-button, #primary input.dt-button {
    border: none;
    border-radius: 6px;
    background: #EFEFEF;
    /* background: transparent; */
    color: #03151E;
    transition: all 0.2s ease-in-out;
    padding: 6px 20px;
    font-size: 14px;
}
#primary button.dt-button:hover, #primary div.dt-button:hover, #primary a.dt-button:hover, #primary input.dt-button:hover {
    opacity: 0.8;
}
.dark #primary button.dt-button, #primary div.dt-button,
.dark #primary a.dt-button, #primary input.dt-button {
    color: white;
    background: #3A3B3C;
}
#primary button.dt-button.add-patron {
    padding-left: 40px;
    position: relative;
    background-color: #4BC1D2;
    /* color: #eaf8fd; */
    color: #fff;
    /* margin-right: 40px; */
    padding: 6px 20px 6px 40px;
    font-weight: 400;
    top: 2px;
}
#primary button.dt-button.add-account {
    padding-left: 40px;
}
#primary button.dt-button.add-patron:hover {
    background: #0096B5;
    opacity: 1;
}
.dark #primary button.dt-button.add-patron {
    background-color: #0096B5;
}
.dark #primary button.dt-button.add-patron:hover {
    background-color: #007c96;
    opacity: 1;
}
#primary button.dt-button.add-patron:before,
#primary button.dt-button.add-account:before {
    content: "+";
    font-weight: 200;
    /* color: #eaf8fd; */
    color: #fff;
    position: absolute;
    left: 15px;
    top: 6px;
    font-size: 24px;
}
#primary .dt-button.delete-patron {
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #DF6C5E;
    background-size: 12px auto;
    color: #fff;
    padding-left: 40px;
}
#primary .dt-button.delete-patron:hover, #primary .dt-button.delete-patron:active {
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #EC7D78;
    background-size: 12px auto;
    color: #fff;
    padding-left: 40px;
}
.dark #primary .dt-button.delete-patron {
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #DF6C5E;
    background-size: 12px auto;
    color: #fff;
    padding-left: 40px;
}
.dark #primary .dt-button.delete-patron:hover, .dark #primary .dt-button.delete-patron:active {
    background: url(/img/library/datatables/delete-white.svg) no-repeat left 15px center #B95049;
    background-size: 12px auto;
    color: #fff;
    padding-left: 40px;
}
#primary .dt-button.loading.delete-patron {
    background-image: url(/img/public/icons/loading.svg) !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 25px auto !important;
}
.dataTables_wrapper #archive-items-table_filter.dataTables_filter input,
.dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input,
.dataTables_wrapper #ultimate-table_filter.dataTables_filter input,
.dataTables_wrapper #patron-table_filter.dataTables_filter input,
#current-holds .dataTables_wrapper .dataTables_filter input,
#current-checkouts .dataTables_wrapper .dataTables_filter input
 {
    border: 1px solid #dedede;
    border-radius: 6px;
    padding: 5px 15px;
    background-color: transparent;
    margin-left: 3px;
    padding-right: 30px;
    width: 250px;
    background: url(/img/library/icons/icon-search-gray.svg) no-repeat right 15px center;
    background-size: 15px auto;
    transition: all 0.2s ease-in-out;
}
.dark .dataTables_wrapper #archive-items-table_filter.dataTables_filter input,
.dark .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input,
.dark .dataTables_wrapper #patron-table_filter.dataTables_filter input,
.dark #current-holds .dataTables_wrapper .dataTables_filter input,
.dark #current-checkouts .dataTables_wrapper .dataTables_filter input {
    border: 1px solid #232323;
    background-color: #131313;
    transition: all 0.2s ease-in-out;
    color: #fff;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.7);
}
.dataTables_wrapper #archive-items-table_filter.dataTables_filter input:focus,
.dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input:focus,
.dataTables_wrapper #ultimate-table_filter.dataTables_filter input:focus,
.dataTables_wrapper #patron-table_filter.dataTables_filter input:focus,
#current-holds .dataTables_wrapper .dataTables_filter input:focus,
#current-checkouts .dataTables_wrapper .dataTables_filter input:focus {
    border: 1px solid #dedede;
    border-top: 1px solid #f6f6f6;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1), 0px 8px 16px -10px rgba(0,0,0,0.3);
    background-color: #f9f9f9;
}
.dark .dataTables_wrapper #archive-items-table_filter.dataTables_filter input:focus,
.dark .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input:focus,
.dark .dataTables_wrapper #patron-table_filter.dataTables_filter input:focus,
.dark #current-holds .dataTables_wrapper .dataTables_filter input:focus,
.dark #current-checkouts .dataTables_wrapper .dataTables_filter input:focus
{
    border: 1px solid #232323;
    border-top: 1px solid #131313;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.7), 0px 8px 16px -10px rgba(0,0,0,0.8);
    background-color: #101010;
}
#primary .dataTables_wrapper .dataTables_paginate .paginate_button.current,
#primary .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: none;
    border-radius: 6px;
    background: #EFEFEF;
    color: #03151E;
    border: none;
    transition: all 0.2s ease-in-out;
}
#primary .dataTables_wrapper .dataTables_paginate .paginate_button {
    border: none;
}
.dark #primary .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dark #primary .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: #3A3B3C;
    color: white !important;
}
#primary .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    opacity: 0.8;
}
#primary .dataTables_wrapper thead {
    background: #f6f6f6;
    border-bottom: none;
    border-top: none;
}
.dark #primary .dataTables_wrapper thead {
    background: #282828;
}
#primary .dataTables_wrapper thead th {
    font-size: 12px;
    text-transform: uppercase;
    color: #8a8a8a;
}
#primary td {
    font-weight: normal;
    font-size: 14px;
    color: #03151E;
}
.dark #primary td {
    color: white;
}
#primary .dataTables_wrapper .dataTables_length,
#primary .dataTables_wrapper .dataTables_filter,
#primary .dataTables_wrapper .dataTables_info,
#primary .dataTables_wrapper .dataTables_processing,
#primary .dataTables_wrapper .dataTables_paginate {
    color: #666;
}
.dark #primary .dataTables_wrapper .dataTables_length,
.dark #primary .dataTables_wrapper .dataTables_filter,
.dark #primary .dataTables_wrapper .dataTables_info,
.dark #primary .dataTables_wrapper .dataTables_processing,
.dark #primary .dataTables_wrapper .dataTables_paginate {
    color: #ccc;
}
.dark #primary .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dark #primary .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dark #primary .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    color: #ccc !important;
}
#primary table.dataTable.stripe tbody tr.odd,
#primary table.dataTable.display tbody tr.odd {
    background-color: #fff;
}
.dark #primary table.dataTable.stripe tbody tr.odd,
.dark #primary table.dataTable.display tbody tr.odd {
    background-color: #1B1B1B;
}
#primary table.dataTable.stripe tbody tr.past-due.odd,
#primary table.dataTable.display tbody tr.past-due.odd,
#primary table.dataTable.stripe tbody tr.past-due.even,
#primary table.dataTable.display tbody tr.past-due.even  {
    background-color: #ffe4df;
}
.dark #primary table.dataTable.stripe tbody tr.past-due.odd,
.dark #primary table.dataTable.display tbody tr.past-due.odd,
.dark #primary table.dataTable.stripe tbody tr.past-due.even,
.dark #primary table.dataTable.display tbody tr.past-due.even  {
    background-color: #421d1b;
}
#primary table.dataTable.display tbody tr.odd.freeze,
#primary table.dataTable.display tbody tr.even.freeze {
    /* background-color: #d5e6ed; */
    background: repeating-linear-gradient(
        -45deg,
        #f0fbff,
        #f0fbff 10px,
        #edf7fe 10px,
        #edf7fe 20px
    );
}
.dark #primary table.dataTable.display tbody tr.odd.freeze,
.dark #primary table.dataTable.display tbody tr.even.freeze {
    /* background-color: #d5e6ed; */
    background: repeating-linear-gradient(
        -45deg, #123f51, #123f51 10px, #184456 10px, #184456 20px
    );
}

#primary table.dataTable.row-border tbody .past-due td,
#primary table.dataTable.display tbody .past-due td {
    /* border-top: 1px solid #ffd1c8; */
    border: none;
}
.dark #primary table.dataTable.row-border tbody .past-due td,
.dark #primary table.dataTable.display tbody .past-due td {
    /* border-top: 1px solid #0c0404; */
    border: none;
}
#primary table.dataTable.display tbody tr.past-due.odd>.sorting_1,
#primary table.dataTable.order-column.stripe tbody tr.past-due.odd>.sorting_1,
#primary table.dataTable.display tbody tr.past-due.even>.sorting_1,
#primary table.dataTable.order-column.stripe tbody tr.past-due.even>.sorting_1 {
    background-color: #f7dad5;
}
.dark #primary table.dataTable.display tbody tr.past-due.odd>.sorting_1,
.dark #primary table.dataTable.order-column.stripe tbody tr.past-due.odd>.sorting_1,
.dark #primary table.dataTable.display tbody tr.past-due.even>.sorting_1,
.dark #primary table.dataTable.order-column.stripe tbody tr.past-due.even>.sorting_1 {
    background-color: #2D0807;
}
#primary table.dataTable thead th,
#primary table.dataTable thead td {
    border-bottom: none;
    /* border-top: 1px solid #EFEFEF; */
    border: none;
    padding: 10px 10px;
}
.dark #primary table.dataTable thead th,
.dark #primary table.dataTable thead td {
    border-bottom: none;
    /* border-top: 1px solid #000; */
    border: none;
    padding: 10px 10px;
}
#primary table.dataTable thead th:first-child {
    border-radius: 6px 0px 0px 0px;
}
#primary table.dataTable thead th:last-child {
    border-radius: 0px 6px 0px 0px
}
#primary table.dataTable.row-border tbody th,
#primary table.dataTable.row-border tbody td,
#primary table.dataTable.display tbody th,
#primary table.dataTable.display tbody td {
    /* border-top: 1px solid #EFEFEF; */
    border: none;
}
.dark #primary table.dataTable.row-border tbody th,
.dark #primary table.dataTable.row-border tbody td,
.dark #primary table.dataTable.display tbody th,
.dark #primary table.dataTable.display tbody td {
    /* border-top: 1px solid #000; */
    border: none;
}
#primary .dataTables_wrapper.no-footer .dataTables_scrollBody {
    /* border-bottom: 1px solid #EFEFEF; */
    border: none;
}
.dark #primary .dataTables_wrapper.no-footer .dataTables_scrollBody {
    /* border-bottom: 1px solid #000; */
    border: none;
}
#primary .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
#primary .dataTables_wrapper.no-footer div.dataTables_scrollBody>table {
    /* border: 1px solid #EFEFEF; */
    border-top: none;
    border-bottom: none;
    /* border-left: 1px solid #EFEFEF; */
    /* border-right: 1px solid #EFEFEF; */
    border: none;
    box-sizing: border-box;
}
.dark #primary .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
.dark #primary .dataTables_wrapper.no-footer div.dataTables_scrollBody>table {
    /* border: 1px solid #000; */
    border-top: none;
    border-bottom: none;
    /* border-left: 1px solid #000; */
    /* border-right: 1px solid #000; */
    border: none;
    box-sizing: border-box;
}
#primary table.dataTable.display tbody tr.odd>.sorting_1,
#primary table.dataTable.order-column.stripe tbody tr.odd>.sorting_1,
#primary table.dataTable.display tbody tr.even>.sorting_1,
#primary table.dataTable.order-column.stripe tbody tr.even>.sorting_1 {
    background-color: #efefef;
}
#primary table.dataTable.display tbody tr.odd.freeze>.sorting_1,
#primary table.dataTable.display tbody tr.even.freeze>.sorting_1 {
    background-color: #dbebf2;
}
.dark #primary table.dataTable.display tbody tr.odd>.sorting_1,
.dark #primary table.dataTable.order-column.stripe tbody tr.odd>.sorting_1,
.dark #primary table.dataTable.display tbody tr.even>.sorting_1,
.dark #primary table.dataTable.order-column.stripe tbody tr.even>.sorting_1 {
    background-color: #131313;
}
.dark #primary table.dataTable.display tbody tr.odd.freeze>.sorting_1,
.dark #primary table.dataTable.display tbody tr.even.freeze>.sorting_1 {
    background-color: #0d313f;
}
#primary table.dataTable.hover tbody tr:hover,
#primary table.dataTable.display tbody tr:hover {
    background-color: #f6f6f6;
}
.dark #primary table.dataTable.hover tbody tr:hover,
.dark #primary table.dataTable.display tbody tr:hover {
    background-color: #333;
}
#primary table.dataTable thead .sorting_asc {
    background-image: url(/img/library/datatables/sort_asc.png);
}
#primary table.dataTable thead .sorting_desc {
    background-image: url(/img/library/datatables/sort_desc.png);
}
.patron-edit {
    font-size: 14px;
}
.button.secondary.patron-edit:hover {
    background-color: #EFEFEF;
    color: #03151E;
    opacity: 0.8;
}
.dark .button.secondary.patron-edit:hover {
    background-color: #131313;
    color: #fff;
    opacity: 0.8;
}
span.deleted-warning {
    font-size: 14px;
    font-weight: bold;
    color: #DF6C5E;
}
tr.deleted-item {
    background: repeating-linear-gradient( -45deg, #ffeceb, #ffeceb 10px, #fff8f8 10px, #fff8f8 20px ) !important;
}
.dark tr.deleted-item {
    background: repeating-linear-gradient( -45deg, #2D0807 , #2D0807 10px, #360705 10px, #360705 20px ) !important;
}
tr.deleted-item td {
    background-color: transparent !important;
}
#primary table.dataTable tbody td.select-checkbox:before,
#primary table.dataTable tbody th.select-checkbox:before {
    content: ' ';
    margin-top: -24px;
    margin-left: -6px;
    border: 1px solid #ccc;
    border-radius: 0px;
    height: 16px;
    width: 16px;
    border-radius: 2px;
    background-color: #f6f6f6;
    position: relative;
}
.dark #primary table.dataTable tbody td.select-checkbox:before,
.dark #primary table.dataTable tbody th.select-checkbox:before {
    content: ' ';
    border: 1px solid #000;
    background-color: #080808;
}
#primary table.dataTable tr.selected td.select-checkbox:after,
#primary table.dataTable tr.selected th.select-checkbox:after {
    content: '';
    margin-top: -18px;
    margin-left: -6px;
    text-align: center;
    position: relative;
    text-shadow: none;
    background-color: #fff;
    background-image: url(/img/library/datatables/check.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 18px auto;
    height: 18px;
    width: 18px;
    border-radius: 2px;
}
.dark #primary table.dataTable tr.selected td.select-checkbox:after,
.dark #primary table.dataTable tr.selected th.select-checkbox:after {
    content: '';
    background-color: transparent;
    background-image: url(/img/library/datatables/check.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 18px auto;
}
#primary table.dataTable tbody>tr.odd.selected,
#primary table.dataTable tbody>tr.even.selected,
#primary table.dataTable tbody>tr>.selected {
    background-color: #e6e6e6;
}
.dark #primary table.dataTable tbody>tr.odd.selected,
.dark #primary table.dataTable tbody>tr.even.selected,
.dark #primary table.dataTable tbody>tr>.selected {
    background-color: #282828;
    color: white;
}
#primary table.dataTable tbody td.patron-barcode {
    padding-left: 30px;
    background-image: url(/img/library/datatables/icon-barcodes.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
}
.dark #primary table.dataTable tbody td.patron-barcode {
    background-image: url(/img/library/datatables/icon-barcodes-white.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px auto;
}
#primary table.dataTable thead th.out-icon span {
    font-size: 12px;
    margin-right: 2px;
}
#primary td.patron-holds {
    text-align: left;
}
#primary td.patron-out {
    text-align: left;
}
#primary .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 3px 10px;
}
#primary .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #EFEFEF;
    color: #03151E !important;
    border-radius: 6px;
    border: none;
}
#primary .dataTables_wrapper .dataTables_paginate {
    padding-top: 5px;
}
.dark #primary table.dataTable thead .sorting {
    background-image: url(/img/library/datatables/sort_both-dark.png);
}
.lending-call-number {
    background: #efefef;
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
}
.dark .lending-call-number {
    background: #282828;
    color: white;
}
@media screen and (max-width: 63.9375em) {
    #primary div.dt-buttons {
        text-align: left;
    }
	#primary button.dt-button.add-patron  {
        display: block;
        margin-bottom: 10px;
    }
    .lending-view .dataTables_wrapper #archive-items-table_filter.dataTables_filter input,
    .lending-view .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input,
    .lending-view .dataTables_wrapper #patron-table_filter.dataTables_filter input {
        position: relative;
        top: 38px;
        width: 200px;
    }
    .dataTables_wrapper #archive-items-table_filter.dataTables_filter input,
    .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input,
    .dataTables_wrapper #patron-table_filter.dataTables_filter input {
        top: auto;
        position: relative;
        width: 200px;
    }
}
@media screen and (max-width: 39.9375em) {
    .dataTables_wrapper #archive-items-table_filter.dataTables_filter,
    .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter,
    .dataTables_wrapper #patron-table_filter.dataTables_filter {
        margin-top: 5px;
    }
    .dataTables_wrapper #archive-items-table_filter.dataTables_filter input,
    .dataTables_wrapper #archive-libraries-table_filter.dataTables_filter input,
    .dataTables_wrapper #patron-table_filter.dataTables_filter input,
    #current-holds .dataTables_wrapper .dataTables_filter input,
    #current-checkouts .dataTables_wrapper .dataTables_filter input {
        position: relative;
        top: 0px;
        width: 100%;
        margin-left: 0px;
    }
    input#litepicker {
        width: 100%;
        margin-bottom: 0px;
    }
    body .litepicker .container__footer .preview-date-range {
        font-size: 8px;
        margin-right: 5px;
    }
}

/* ADD PATRON */
.breadcrumbs {
    margin-bottom: 30px;
    margin-top: -15px
}
.breadcrumbs li {
    font-size: 20px;
    font-weight: bold;
    text-transform: none;
}
.breadcrumbs li span, .breadcrumbs li a {
    display: inline-block;
    padding-top: 0px;
    padding-bottom: 5px;
}
.breadcrumbs li.active span {
    border-bottom: 3px solid #4BC1D2;
}
.breadcrumbs li a {
    color: #bbb;
    text-decoration: none;
    border: none;
}
.breadcrumbs li a:hover, .breadcrumbs li a:active {
    color: #03151E;
    text-decoration: none;
}
.dark .breadcrumbs li a:hover, .dark .breadcrumbs li a:active {
    color: #fff;
    text-decoration: none;
}
@media screen and (max-width: 39.9375em) {
	.breadcrumbs li {
        font-size: 16px;
        font-weight: bold;
        text-transform: none;
    }
    .breadcrumbs li span, .breadcrumbs li a {
        display: inline-block;
        padding-top: 3px;
        padding-bottom: 3px;
    }
}

/* CHECK-IN MODE or CHECKIN MODE */
#check-in-barcode {
    max-width: 100%;
    height: 80px;
    border: none;
    box-shadow: 0px 10px 18px -5px rgb(0 0 0 / 30%);
    border-radius: 14px;
    padding: 20px;
    font-size: 30px;
    background-image: url(/img/library/icons/icon-barcodes-gray.svg);
    background-repeat: no-repeat;
    background-position: left 20px center;
    background-size: 60px auto;
    transition: all 0.5s ease-in-out;
    position: relative;
    z-index: 2;
    /* text-align: center; */
    border: 1px solid #dedede;
    text-indent: 75px;
}
.dark #check-in-barcode {
    box-shadow: 0px 10px 18px -5px rgb(0 0 0 / 70%);
    border: 1px solid #131313;

}
#check-in-barcode:focus {
    /* max-width: 800px;
    height: 100px; */
    /* transform: scale(1.1); */
    box-shadow: 0px 10px 18px -5px rgb(0 0 0 / 15%);
}
#check-in-temp-list:empty {
    background: none;
    top: -50px;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}
#check-in-temp-list {
    top: 0px;
    opacity: 1;
    margin: auto;
    padding: 20px;
    text-align: left;
    display: block;
    z-index: 1;
    position: relative;
    transition: all 0.3s ease-in-out;
}
#check-in-temp-list div {
    background: url(/img/library/icons/icon-returned-green.svg) no-repeat left center;
    background-size: 50px auto;
    display: block;
    line-height: 1.4em;
    padding-left: 80px;
    font-size: 26px;
    text-align: left;
    margin-bottom: 10px;
}
@media screen and (max-width: 39.9375em) {
	#check-in-barcode {
        font-size: 14px;
        height: 60px;
        background-size: 40px auto;
        padding: 10px;
        background-position: left 10px center;
        text-indent: 50px;
    }
    #check-in-temp-list div {
        font-size: 16px;
        background-size: 40px auto;
        padding-left: 50px;
    }
}

/* CHECKOUT & HOLDS TABLE */
td.lending-item-image img {
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
}
td.lending-title {
    min-width: 140px;
    max-width: 225px;
}
.lending-item-title {
    font-weight: bold;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.dark .lending-item-title {
    color: white;
}
.lending-creators {
    color: #8a8a8a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#primary table.dataTable tbody td.lending-library {
    padding-left: 25px;
    background-image: url(/img/library/datatables/icon-libraries-dark.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#primary table.dataTable tbody td.total-managers {
    padding-left: 25px;
    background-image: url(/img/library/datatables/icon-managers-dark.svg);
    background-repeat: no-repeat;
    background-position: left 5px center;
    background-size: 15px auto;
    width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#primary table.dataTable tbody td.lending-date {
    padding-left: 35px;
    background-image: url(/img/library/datatables/calendar.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 15px auto;
    white-space: nowrap;
    overflow: hidden;
    min-width: 120px;
    box-sizing: border-box;
}
#primary table.dataTable tbody td.lending-date span {
    cursor: pointer;
    border-radius: 3px;
    padding: 5px;
    background: rgba(0,0,0,0.05);
    transition: all 0.3s ease-in-out;
    border: 1px solid transparent;
}
#primary table.dataTable tbody td.lending-date span:hover {
    border: 1px solid rgba(0,0,0,0.15);
}
.dark #primary table.dataTable tbody td.lending-date span  {
    background: rgba(255,255,255, .05);
}
.dark #primary table.dataTable tbody td.lending-date span:hover {
    border: 1px solid rgba(255,2552,255,0.15);
}
.hold-release,
.hold-checkout,
.button.checkouts-check-in,
.lending-results-hold-release {
    padding: 8px 15px;
    font-size: 14px;
    width: 96px;
    margin-bottom: 3px;
    font-weight: bold;
}
.hold-release,
.lending-results-hold-release {
    background-color: white;
    border: 1px solid #dedede;
    color: #404040;
}
.hold-checkout,
.button.checkouts-check-in {
    border: 1px solid #4BC1D2
}
.dark .hold-release,
.dark .lending-results-hold-release {
    background-color: #1b1b1b;
    color: white;
    border: 1px solid #404040;
}
.dark .hold-checkout,
.dark .button.checkouts-check-in {
    border: 1px solid #0096B5;
}
.hold-release:hover,
.lending-results-hold-release:hover {
    background: #efefef;
    color: #404040;
}
.dark .hold-release:hover,
.dark .lending-results-hold-release:hover {
    background: #131313;
    color: #fff;
}
.hold-checkout:hover,
.button.checkouts-check-in:hover {
    border: 1px solid #0096B5;
}
.dark .hold-checkout:hover,
.dark .button.checkouts-check-in:hover {
    border: 1px solid #007c96;
}
.button.tiny.checkouts-check-in,
.button.tiny.lending-results-hold-release {
    padding: 5px 10px;
    font-size: 12px;
}
/* .ultimate-logout {
    padding-left: 30px;
    background-image: url(/img/library/icons/icon-logout-white.svg);
    background-repeat: no-repeat;
    background-size: 20px auto;
    background-position: left center;
} */

/* BARCODES PAGE */

.select-all-collections {
  padding-left:14px;
  padding-right:14px;
  margin-left: 10px;
}

/* LENDING PRINT PAGES */
@media print {
    #left-sidebar,
    ul.admin-tabs,
    .dataTables_filter,
    #inspector,
    td.holds-actions,
    #current-holds th:last-child,
    #holds-date-range-help,
    #checkouts-date-range-help {
        display: none;
    }
    h1.admin-title {
        margin-bottom: 20px;
    }
    #primary {
        left: auto;
        top: auto;
        bottom: auto;
        position: relative;
        width: 100%;
    }
    #holds-litepicker-container, #checkouts-litepicker-container {
        width: 1000px;
        top: 40px;
        left: 190px;
        position: absolute;
    }
    #checkouts-litepicker-container {
        left: 270px;
    }
    .checkouts-check-in {
        display: none;
    }
    #primary td br {
        display: none;
    }
    #primary table.dataTable.stripe tbody tr.past-due.odd, #primary table.dataTable.display tbody tr.past-due.odd, #primary table.dataTable.stripe tbody tr.past-due.even, #primary table.dataTable.display tbody tr.past-due.even {
        background: #FFE3E0 !important;
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
    }
    #primary .dataTables_wrapper .dataTables_paginate .paginate_button.current {
        border: 1px solid #03151E;
    }
    .dark #primary table.dataTable.row-border tbody th, .dark #primary table.dataTable.row-border tbody td, .dark #primary table.dataTable.display tbody th, .dark #primary table.dataTable.display tbody td {
        border-top: 1px solid #efefef;
    }
    .dark #primary table.dataTable thead th, .dark #primary table.dataTable thead td {
        border-top: 1px solid #efefef;
    }
    .dark thead, .dark tbody, .dark tfoot {
        border: 1px solid #efefef;
    }
    .dark #primary .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable, .dark #primary .dataTables_wrapper.no-footer div.dataTables_scrollBody>table {
        border-right: 1px solid #efefef;
        border-left: 1px solid #efefef;
    }
    .dark #primary .dataTables_wrapper.no-footer .dataTables_scrollBody {
        border-bottom: 1px solid #efefef;
    }
}

/* END LENDING PAGE */

/* PATRON PAGE */
.lock-icon {
  background-image: url(/img/library/icons/icon-locked.svg);
  background-repeat: no-repeat;
  background-size: 18px 18px;
  height: 18px;
  width: 18px;
  cursor: pointer;
  display: inline-block;
  opacity: 0.5;
}
  .dark .lock-icon {
    background-image: url(/img/library/icons/icon-locked-white.svg);
    opacity: 0.5;
  }
  .lock-icon:hover {
    background-image: url(/img/library/icons/icon-unlocked.svg);
    opacity: 1;
  }
  .dark .lock-icon:hover {
    background-image: url(/img/library/icons/icon-unlocked-white.svg);
    opacity: 1;
  }
/* END PATRON PAGE */

/* PUBLISH PAGE */

/* PUBLISH URL */
.publish-options-page h4 {
    margin-bottom: 10px;
}
#publish-domain {
    background: #efefef;
    padding: 6px 14px;
    border-radius: 4px 0px 0px 4px;
    border: 1px solid #dedede;
    color: #404040;
    cursor: pointer;
    border-right: none;
    float: left;
}
.dark #publish-domain {
    background: #282828;
    border: 1px solid #333;
    color: #ccc;
}
#publish-url {
    padding: 6px 14px;
    border: 1px solid #dedede;
    border-radius: 0px 4px 4px 0px;
    display: inline-block;
    min-width: 25px;
    background: white;
    font-weight: bold;
    vertical-align: bottom;
}
.dark #publish-url {
    border: 1px solid #333;
    background: #1b1b1b;
}
@media screen and (max-width: 39.9375em) {
	#publish-domain, #publish-url {
        font-size: 12px;
    }
}
.publish-text {
    font-style: italic;
    margin-top: 0px;
    font-size: 16px;
    margin-bottom: 10px;
    line-height: 1.6em;
}
a#published-url-link, span#published-url-link {
    font-style: normal;
    margin-left: 5px;
    color: #0096B5;
}
.no-bottom-margin {
  margin-bottom: 0px;
}
#publish-select-all {
    margin-bottom: 0px;
    border: 1px solid #dedede;
}
.dark #publish-select-all {
    border: 1px solid #2d2d2d;
}
select[multiple] {
    padding: 10px;
    background: #fff;
}
.dark select[multiple] {
    background: #131313;
    border: 1px solid #232323;
    color: #666;
}
select[multiple] option {
    padding: 3px;
    border-radius: 3px;
    margin-bottom: 2px;
    background: none;
    color: #666;
}
.dark select[multiple] option {
    color: #8a8a8a;
}
select[multiple] option:last-child {
    margin-bottom: 0px;
}
.dark .chosen-container-multi .chosen-choices li.search-field input[type=text] {
    color: white !important;
}
textarea#announcement-message {
    height: 150px;
}

.options-table tr {
  vertical-align: middle;
}
.options-table {
    border-collapse: separate;
    border-radius: 8px;
    border: 1px solid #dedede;
    margin-top: 20px;
}
.dark .options-table {
    border: 1px solid #282828;
}
.options-table td {
    padding: 20px;
    border-bottom: 1px solid #dedede;
}
.dark .options-table td {
    border-bottom: 1px solid #282828;
}
.options-table .switch {
    margin-bottom: 0px;
}
.options-table .description {
    color: #666;
    font-style: italic;
}
.dark .options-table .description {
    color: #8a8a8a;
}
.jscolor-picker-border {
    border: none !important;
}
.dark .jscolor-picker-border {
    background: #282828 !important;
}
.jscolor-picker > div {
    border: 1px solid #ccc !important;
}
.dark .jscolor-picker > div {
    border: 1px solid #000 !important;
}

.switch-paddle.disabled {
  cursor: not-allowed !important;
}
/* END PUBLISH PAGE */


/* THEME PAGE */

img.crop-img {
  max-width: none;
}
/* END THEME PAGE */

/* SETTINGS */
.button.restore-patron {
    margin-bottom: 0px;
}

td.archive-item-image {
  width: 50px;
}
td.archive-item-image img {
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
}
#archive-list .dataTables_filter {
    float: none;
    text-align: left;
    margin-top: 20px;
}
#archive-list .dataTables_filter input[type="search"] {
    width: 300px;
}
/* END SETTINGS */

/* BARCODES TOOL */
.barcodes-border {
    border: 1px solid #dedede;
    border-radius: 10px;
    padding: 30px 30px 20px 30px;
    margin-bottom: 30px;
}
@media screen and (max-width: 39.9375em) {
	.barcodes-border {
        padding: 20px 20px 10px 20px;
    }
}
.dark .barcodes-border {
    border: 1px solid #2d2d2d;
}
#barcode-type a.button {
    max-width: 150px;
}
@media only screen and (max-width: 1100px) and (min-width: 1024px) {
    #barcode-type a.button {
        max-width: 115px;
    }
}
.barcodes-title {
    font-size: 18px;
}
.safari #browser-test {
    display: none;
}
#browser-message {
    display: none;
}
.safari #browser-message {
    display: block;
}

/* ULIMATE ADMIN */
.ultimate-admin-tpl {
  background: white;
  overflow: auto;
  height: auto;
}
.ultimate-admin-tpl .accent-bar {
  height: 50px;
  /* background: rgb(205,117,168); */
  background: #004557;
  width: 100%;
  position: fixed;
  left: 0px;
  top: 0px;
  right: 0px;
  z-index: 1;
}
.ultimate-admin-tpl .chosen-disabled .chosen-single {
  background: #e6e6e6;
}
#ultimate-logo {
    height: 50px;
    display: inline-block;
    background: url(/img/public/libib_logo_white.svg) no-repeat left center;
    background-size: auto 20px;
    width: 50px;
    margin-left: 25px;
}
#ultimate-name {
  font-size: 22px;
  font-weight: bold;
  position: absolute;
  right: 25px;
  line-height: 22px;
  top: 14px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 550px;
}
.ultimate-admin-tpl #scheduled-list {
  margin-left: 0px;
}
.ultimate-admin-tpl #scheduled-list li {
  list-style: none;
  display: block;
  padding: 10px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.ultimate-admin-tpl #scheduled-list li:nth-child(odd) {
  background: #f1f1f1;
}

@media screen and (max-width: 39.9375em) {
	#ultimate-name {
    font-size: 16px;
    line-height: 16px;
    top: 17px;
    max-width: 250px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    right: 80px;
  }
}
#ultimate-menu {
    position: fixed;
    top: 50px;
    left: 0px;
    right: 0px;
    height: 50px;
    z-index: 1;
    background: #ffd1f098;
    border-bottom: 1px solid #C665A320;
    background: #0096b530;
    border-bottom: 1px solid #65b0c652;
    backdrop-filter: blur(20px);
}
#ultimate-menu ul {
    margin-left: 0px;
    margin-bottom: 0px;
}
#ultimate-menu ul li {
    display: inline-block;
    list-style: none;
}
#ultimate-menu ul li a {
    display: inline-block;
    line-height: 50px;
    height: 50px;
    padding: 0px 30px;
    font-size: 16px;
    color: #AA618D;
    color: #004557;
}
#ultimate-menu ul li a:hover {
    background-color: #AA618D20;
    background-color: #00455720;
}
#ultimate-menu ul li a.ultimate-dashboard-item {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-home.svg);
    background-repeat: no-repeat;
    background-size: 18px auto;
    background-position: 21px center;
}
#ultimate-menu ul li a.ultimate-api-item {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-api.svg);
    background-repeat: no-repeat;
    background-size: 18px auto;
    background-position: 21px center;
}
#ultimate-menu ul li a.ultimate-import-item {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-import.svg);
    background-repeat: no-repeat;
    background-size: 16px auto;
    background-position: 22px center;
}
#ultimate-menu ul li a.ultimate-export-item {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-export.svg);
    background-repeat: no-repeat;
    background-size: 16px auto;
    background-position: 22px center;
}
#ultimate-menu ul li a.ultimate-sso-settings {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-sso.svg);
    background-repeat: no-repeat;
    background-size: 18px auto;
    background-position: 22px center;
}
#ultimate-menu ul li a.ultimate-settings-item {
    padding-left: 50px;
    background-image: url(../../img/library/icons/icon-district-settings.svg);
    background-repeat: no-repeat;
    background-size: 20px auto;
    background-position: 20px center;
}
#ultimate-menu-icon {
    display: none;
    cursor: pointer;
}
@media screen and (max-width: 800px) {
    .ultimate-admin-tpl #ultimate-menu {
        display: none;
    }
    #ultimate-menu.open {
        display: block;
    }
    #ultimate-menu-icon {
        background: url(/img/public/icons/menu-white.svg) no-repeat center center;
        height: 40px;
        width: 40px;
        background-size: 30px auto;
        position: absolute;
        right: 25px;
        top: 5px;
        display: inline-block;

    }
    #ultimate-name {
        right: 80px;
    }
    #ultimate-menu {
        display: block;
        width: auto;
        min-width: 250px;
        right: 0px;
        left: auto;
        height: auto;
        padding: 20px 20px;
    }
    #ultimate-menu ul li {
        display: block;
    }
    #ultimate-menu ul li a {
        display: block;
        width: 100%;
    }
    #ultimate-menu .grid-container,
    #ultimate-menu .grid-x.grid-margin-x,
    #ultimate-menu .cell {
        padding: 0px;
        margin: 0px;
        display: block;
        width: 100%;
    }
}
@media screen and (max-width: 499px) {
    #ultimate-menu {
        width: 100%;
        left: 0px;
        box-shadow: 0px 2px 6px rgba(0,0,0,0.3);
    }
    #ultimate-menu ul li a {
        font-size: 18px;
    }
}
.ultimate-admin-tpl #primary {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    padding-top: 40px;
    padding-bottom: 40px;
    background: #fff;
    overflow: auto;
}
#sso-settings-form {
    background: #fff7fc;
    border-radius: 8px;
    margin-left: 0.9375rem;
    margin-right: 0.9375rem;
    padding: 0px 20px 20px;
    margin-top: 10px;
}
.fieldset-title {
    font-weight: 900;
    line-height: 1em;
    font-size: 1.5em;
    margin-bottom: 30px;
    margin-top: 30px;
}
.fieldset-section {
    background: #CD75A8;
    padding: 10px 20px;
    color: white;
    /* remove once patrons are added */
    border-radius: 0px !important;
}
.fieldset-section.tr-br {
    background: #0096B5;
    padding: 10px 20px;
}
.tl-br {
    border-top-left-radius: 8px;
}
.tr-br {
    border-top-right-radius: 8px;
}
.bl-br {
    border-bottom-left-radius: 8px;
}
.br-br {
    border-bottom-right-radius: 8px;
}
.fieldset-option {
    padding: 20px;
    border: 1px solid #E1ACCB;
    border-radius: 8px;
    margin: 20px 0px;
    background: #f9e7f390;
}
.fieldset-option.ml {
    padding: 20px;
    border: 1px solid #dedede;
    border-radius: 8px;
    margin: 20px 0px;
    background: #4BC1D215;
}
.fieldset-option input[type='radio'] {
    accent-color: #CD75A8;
    transform: scale(1.25);
}
.fieldset-option.ml input[type='radio'] {
    accent-color: #0096B5;
}
.fieldset-option label {
    font-size: 18px;
    font-weight: bold;
    color: #AA618D;
    line-height: 1em;
}
.fieldset-option.ml label {
    font-size: 18px;
    font-weight: bold;
    color: #0096B5;
}
.fieldset-option p {
    padding-bottom: 0px;
    margin-bottom: 0px;
    line-height: 1.4em;
}
.fieldset-option.ml p {
    padding-bottom: 0px;
    margin-bottom: 0px;
    line-height: 1.4em;
}
.fieldset-option.mr {
    margin-right: 10px;
}
.fieldset-option.ml {
    margin-left: 10px;
}
@media screen and (max-width: 39.9375em) {
	.fieldset-option.mr {
        margin-right: 0px;
    }
    .fieldset-option.ml {
        margin-left: 0px;
    }
}
.top-level {
    width: 100%;
    /* background: #eaf3f4;*/
    /* background: #fff7fc; pink */
    background: #eef8fc;
    position: relative;
    padding-top: 90px;
    padding-bottom: 40px;
    margin-top: 50px;
}
@media only screen and (max-width: 800px) {
    .top-level {
        margin-top: 0px;
    }
}
h1.admin-title.with-subtitle {
    margin-bottom: 10px;
}
p.subtitle {
    font-size: 18px;
    font-weight: 300;
    line-height: 1.2em;
    margin-bottom: 0px;
}
p.subtitle.margin-bottom-30 {
  margin-bottom: 30px;
}
.dashboard-stats-wrapper p.subtitle {
    margin-bottom: 30px;
}
.ultimate-stat {
    border-radius: 10px;
    /* background: rgb(255, 252, 249); */
    background: #fff;
    box-shadow: 0px 5px 20px -8px rgb(27 84 112 / 60%);
    padding: 20px 20px 30px;
}
@media screen and (max-width: 39.9375em) {
	.ultimate-stat {
        margin-bottom: 10px;
    }
}
.stat-line {
    font-weight: 900;
    font-size: 28px;
}
#api-table-wrapper {
    max-width: 100%;
    overflow-x: auto;
}
table.api-table {
    border: 1px solid #dedede;
}
table.api-table tr {
    border-bottom: 1px solid #dedede;
}
table.api-table tr > td:first-child {
    background: #4BC1D215;
    border-right: 1px solid #dedede;
}
pre.snippet-code {
    border: 1px solid #dedede;
    border-radius: 5px;
    padding: 50px 0px;
    color: #AA618D;
    font-size: 14px;
    background: #f7f7f7;
}
.ultimate-admin-tpl .chosen-container {
    width: 100% !important;
    max-width: 600px;
}
.ultimate-admin-tpl .accordion-title {
    background: #f6f6f6;
}
#primary button.dt-button.pink {
    background-color: #CD75A8;
    color: white;
}
#primary button.dt-button.blue {
    background-color: #4BC1D2;
    color: white;
}
#primary button.dt-button.blue:hover {
    background-color: #0096B5;
}
#primary button.dt-button.button.blue:active {
    background: #BAD7E3;
}
#primary button.dt-button.ublue {
    background-color: #004557;
    color: white;
}
#primary button.dt-button.ublue:hover {
    background-color: #03151E;
}
#primary button.dt-button.button.ublue:active {
    background: #489cb2;
}
#primary .dt-button.button.salmon {
    background-color: #DF6C5E;
    color: #fff;
}
#primary .dt-button.button.salmon:hover {
    background-color: #B95049;
}
#primary .dt-button.button.salmon:active {
    background-color: #efb5ad;
    box-shadow: none;
}
#primary .dt-button.button.detach-account {
    position: relative;
    top: 10px;
    left: 0px;
    padding-left: 40px;
    background-image: url(/img/library/datatables/icon-detach.svg);
    background-repeat: no-repeat;
    background-size: 10px auto;
    background-position: left 18px center;
}
#primary .dt-button.button.detach-account:hover {
    background-image: url(/img/library/datatables/icon-detach.svg);
    background-repeat: no-repeat;
    background-size: 10px auto;
    background-position: left 18px center;
}
#primary .dt-button.button.detach-account:active {
    background-image: url(/img/library/datatables/icon-detach.svg);
    background-repeat: no-repeat;
    background-size: 10px auto;
    background-position: left 18px center;
}
@media screen and (max-width: 63.9375em) {
	.stat-line {
        font-size: 20px;
    }
}
@media screen and (max-width: 39.9375em) {
	#primary .dt-button.button.detach-account {
        top: 0px;
    }
    #primary button.dt-button.add-account {
        top: 10px;
    }
    .dataTables_wrapper #ultimate-table_filter.dataTables_filter input {
        width: 100%;
    }
    .ultimate-admin-tpl h1.admin-title {
        font-size: 40px;
        margin-top: 0px;
    }
    h1.admin-title.small-margin-bottom-40 {
        margin-bottom: 40px;
    }
}

/* ADD ACCOUNT and EDIT ACCOUNT */
.ultimate-admin-tpl #add-account-form,
.ultimate-admin-tpl #edit-account-form {
    margin-top: 40px;
}
/* ADD ACCOUNT and EDIT ACCOUNT */

/* END ULTIMATE ADMIN */