html, body {
    overflow-x: hidden;
}

body {
    position: relative;
    margin: 0;
    font-family: "Inter var", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    /*overflow: hidden;*/
    font-size: 16px;
    line-height: 28px;
    color: rgb(60,60,67);
    direction: ltr;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

a {
    color: rgb(50, 104, 145);
    outline: none;
}

.form-label {
    font-size: 9px;
    line-height: normal;
    margin-bottom: 2px;
    color: #777;
}

.highlight {
    background-color: yellow;
}

#footer {
    text-align: center;
    font-size: 11px;
    line-height: 20px;
    margin-bottom: 20px;
}

#footer hr {
    width: 80%;
    margin: auto;
    border: 0;
    border-top: solid 1px #444444;
    padding-bottom: 10px;
}

.footer-link {
    margin-right: 10px;
}
/*  Progress Bar */
/* Make clicks pass-through */
#nprogress {
    pointer-events: none;
}

#nprogress .bar {
    background: #29d;
    position: fixed;
    z-index: 1031;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
}

/* Fancy blur effect */
#nprogress .peg {
    display: block;
    position: absolute;
    right: 0px;
    width: 100px;
    height: 100%;
    box-shadow: 0 0 10px #29d, 0 0 5px #29d;
    opacity: 1.0;
    -webkit-transform: rotate(3deg) translate(0px, -4px);
    -ms-transform: rotate(3deg) translate(0px, -4px);
    transform: rotate(3deg) translate(0px, -4px);
}

/*  Progress Bar */


.btn-back {
    position: fixed;
    top: 20px;
    left: 20px;
    font-size: 16px;
    text-decoration: none;
    border: 1px solid #fff;
    padding: 5px 8px;
    border-radius: 3px;
    color: #fff;
    z-index: 99
}

.btn-back:hover {
    background-color: #3c3d3e;
    border-color: #3c3d3e;
    color: #fff
}

:root {
    --easing: cubic-bezier(0.5,0.7,0.4,1)
}


/* Remove References */

div#article_body a.footnote-ref {
    display: none;
}

div#article_body > h2#references {
    display: none;
}

div#article_body > h2#references + ol {
    display: none;
}




/*  Table of Contents */

#toc-container {
    display: none;
    position: absolute;
    left: calc((100% - 70rem)/2);
    top: 80px;
}

#toc-container.hero-image {
    top: 435px;
}

#toc-container.is-position-fixed {
    top: 80px;
}

#toc_header {
    position: relative;
    padding-bottom: 4px;
    width: 170px;
    font-size: 15px;
    font-weight: 500;
}

#page_toc {
    right: 10px;
    top: 100px;
    width: 170px;
    z-index: 5;
    font-size: 13px;
    font-weight: 500;
}

/*#toparrow {
    position: fixed;
    bottom: 20px;
    left: calc((100% - 70rem) / 2);
    padding: 20px;
}

#toc-container.hero-image #toparrow {
    top: 435px;
}*/


@media (min-width: 1180px) {
    #toc-container {
        display: block;
    }
    #profile-left-img {
        display: none;
    }
}

.toc-list {
    list-style: none;
}

.toc {
    overflow-y: auto;
}

.toc > .toc-list {
    overflow: hidden;
    position: relative;
}

.toc > .toc-list li {
    list-style: none;
}

.js-toc {
    overflow-y: hidden;
}

.toc-list {
    margin: 0;
    padding-left: 10px;
}



a.toc-link {
    color: #6c6c6c;
    height: 100%;
    font-size: 12px;
    text-decoration: none;
    transition: color .25s;
}

a.toc-link:hover {
    color: #000;
    height: 100%;
    text-decoration: none;
}

.is-collapsible {
    max-height: 1000px;
    overflow: hidden;
    transition: all 300ms ease-in-out;
}

.is-collapsed {
    max-height: 0;
}

.is-position-fixed {
    position: fixed !important;
    top: 0;
}

li.is-active-li a.toc-link {
    color: #000;
}

.toc-link::before {
    background-color: #EEE;
    content: ' ';
    display: inline-block;
    height: inherit;
    left: 0;
    margin-top: -1px;
    position: absolute;
    width: 2px;
    transition: background-color .25s;
}

.is-active-link::before {
    background-color: #ff3333;
}

#toparrow svg {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    opacity: 0.6;
    right: 14px;
    top: 6px;
    position: absolute;
    cursor: pointer;
}

#toparrow svg:hover {
    opacity: 1;
}




#main {
    margin-top: 40px;
    padding-left: 10px;
}














#action-btn svg {
    width: 24px;
    height: 24px;
    fill: #a7a7a7;
    padding: 3px;
}

#action-btn.hero-image svg {
    fill: #a2a2a2;
}

#action-btn:hover svg {
    background-color: #0505052e;
    fill: #666;
    border-radius: 16px;
}

#breadcrumbs {
    font-size: 12px;
    line-height: 18px;
    white-space: normal;
    margin-right: 100px;
    padding-top: 5px;
}

#breadcrumbs a {
    text-decoration: none;
}
#breadcrumbs a:hover {
    text-decoration: underline;
}

.brdarw {
    display: inline-block;
    width: 16px;
/*    height: 25px;*/
    vertical-align: text-top;
    text-align: end;
}

.brdarw svg {
    height: 1em;
    width: 1em;
    fill: #6c6c6c;
}


p.note {
    background-color: #f6f6f6;
    border-radius: 3px;
    padding: 0 10px;
    font-size: 12px;
    /*display:none;*/
}


.content {
    z-index: 1;
    transition: all .3s ease-out;
    opacity: 1;
    transform: translateY(0);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 80px;
}

.content.images {
    min-height: 800px;
}

.content.article {
    max-width: 650px;
    padding: 0 20px 80px 20px;
    margin-top: unset;
}


#profile-right {
    position: relative;
    margin-bottom: 15px;
}

#profile-right-image {
    z-index: 2;
    position: absolute;
    top: 0px;
    left: 0px;
    border: 0;
    border-radius: 4px;
}

#profile-right-glow {
    z-index: 1;
    margin-top: 10px;
    margin-left: 12px;
    border-width: 0;
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
    border-radius: 4px;
    bottom: -10px;
    -webkit-filter: blur(10px);
    filter: blur(10px);
    opacity: 0.5;
    background-size: contain;
}

#title-div {
    white-space: nowrap;
}

#title-div.hero-image {
    margin-top: -70px;
    color: #fff;
}

#title-div #article-authors {
    font-weight: 500;
    font-size: 15px;
    font-style: italic;
    margin-bottom: 16px;
    margin-right: 100px;
    white-space: normal;
    line-height: normal;
}

#title-div .article-sub {
    color: #777;
    margin-top: -12px;
    font-size: 13px;
}

#article.book {
    margin-left:8px;
    margin-top: 30px;
}

/*#title-div.hero-image {
    margin-top: -70px;
    color: #fff;
}*/

/*#title-div a {
    display: contents;
}*/

#profile-left-img {
    border-width: 0;
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
    border-radius: 4px;
    margin: 0 10px 0 0;
    width: 80px;
}

#title-block {
    font-size: 2em;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    padding: 8px 0 8px 8px;
    margin: -8px 76px 0 -8px;
}

#title-div.hero-image #title-block {
    color: #fff;
    text-shadow: #000000 0px 0 10px;
}
/*#title-block h1 {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}*/

.prop-header {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.5px;
    border-bottom: solid 1px #ddd;
    padding-bottom: 3px;
    margin-bottom: 10px;
}

.prop-container {
    display: inline-block;
    vertical-align: top;
}

.prop-name {
    font-size: 13px;
    color: #888;
    min-width: 130px;
    display: inline-block;
    vertical-align: top;
}

.prop-value {
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
}

.book-desc {
    margin-top: 30px;
}

.btn-amazon {
    color: #000;
    min-height: 30px;
    text-decoration: none;
    display: inline-block;
    background-color: #ff9900;
    border-radius: 4px;
    padding: 1px 14px 1px 8px;
    border: solid 1px #ab5d00;
    background-image: linear-gradient(to bottom, #ffb547, #f99400);
    background-repeat: repeat-x;
    font-family: inherit;
    font-weight: 500;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0), 0 1px 2px rgba(0, 0, 0, 0.05);
    cursor: pointer;
}

.btn-amazon svg {
    vertical-align: middle;
    margin-right: 6px;
    margin-left: 8px;
}

.btn-amazon:hover {
    color: #000;
    background-color: #c07200;
    text-decoration: none;
    background-image: linear-gradient(to top, #ffa51e, #dd9255);
}

.content.news h1 {
    line-height: 1.2em;
}

#article-desc {
    font-size: 15px;
    font-style: italic;
    margin-bottom: 16px;
    margin-right: 100px;
    white-space: normal;
    line-height: normal;
}

#title-div.hero-image #article-desc {
    color: #fff;
}

#article-desc:first-letter {
    text-transform: uppercase;
}

#article a {
    text-decoration: none;
    color: #0088cc;
}

#article h1 {
    font-size: 30px;
    margin-bottom: 10px;
    line-height: 1.4
}

#article p, #article ul {
    /*font-size: 16px;
    line-height: 1.4;
    opacity: .8;*/
    margin-bottom: 8px;
}

/*#article > p:last-of-type::after {
    display: inline-block;
    height: 12px;
    margin-left: 8px;
    margin-top: -2px;
    width: 12px;
    vertical-align: text-top;
    content: url(/favicon-16x16.png);
}*/

#article .footnotes a {
    word-wrap: break-word;
}

.center {
    text-align: center;
}

.pull-right {
    float: right;
}

.right10 {
    margin-right: 10px;
}

.left10 {
    margin-left: 10px;
}

blockquote {
    padding: 0 0 0 15px;
    margin: 0 0 20px;
    border-left: 5px solid #eeeeee;
    font-style: italic;
    font-weight: 300;
}

/* === Filter Pills === */
#filters {
    margin: 0;
}

.filter-pill {
    display: inline-block;
    border-radius: 4px;
    padding: 1px 10px;
    background-color: #dfdfdf;
    font-size: 12px;
    color: #000;
    text-decoration: none;
    margin-right: 8px;
    margin-bottom: 4px;
}

body.dark .filter-pill {
    background-color: #4c4c4c;
    color: #fff;
}

.filter-pill:hover {
    opacity: 0.8;
}
/* === End Filter Pills === */



#article-header {
    margin-top: -60px;
    height: 75vw;
    max-height: 500px;
    color: #fff;
    fill: #fff;
    background-color: #14181d;
    background-size: cover;
    position: relative;
    z-index: 0;
}

#article-header:after {
    background-image: linear-gradient(to bottom,rgba(0,0,0,.4) 0%,transparent);
    content: "";
    display: block;
    height: 100px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 101;
}


#article-header.no-hero-image {
    z-index: 1;
    height: 20px;
    max-height: unset;
    color: #fff;
    fill: #fff;
    background-color: #fff;
    position: relative;
    margin-top: unset;
}

#article-header.no-hero-image:after {
    background-image: none;
    content: "";
    display: none;
}


#article-header-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 1200px;
    width: 100vw;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    box-shadow: inset 0px -20px 50px 20px #14181d;
}

h2.collapsible {
    border-bottom: solid 1px #ddd;
    padding-bottom: 5px;
    cursor: pointer;
}

h2.collapsible:before {
    content: ' ';
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAAASAAAAEgARslrPgAAAHlJREFUSMft0jsOglAQheFPcTsuh459WHLdiZX7sHBLNpBgASSGeFHILeevz5xHMgRB8ItzIc1XrujRrGhqdEg5wXHl+IUKt0xIjTtOGPauuEzHyyVz8wHtXvNcSFHzmTQZdh/mqZT5csmm5tWGgCcOeBg/LAiCP3kDPD4dJC0smVYAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjAtMDMtMjRUMDM6MTA6MTkrMDA6MDCKscpYAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIwLTAzLTI0VDAzOjEwOjE5KzAwOjAw++xy5AAAACh0RVh0c3ZnOmJhc2UtdXJpAGZpbGU6Ly8vdG1wL21hZ2ljay1ZZDdjUkd5dohi98YAAAAASUVORK5CYII=);
    background-size: 24px 24px;
    display: inline-block;
    vertical-align: text-bottom;
    width: 24px;
    height: 24px;
    opacity: 0.5;
    margin-right: 6px;
}

h2.collapsible.active:before {
    content: ' ';
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAAASAAAAEgARslrPgAAAGVJREFUSMdjYBgFo2AUkAoaGBgYOmhp+H8oprolMMN/Q/F/qBhVDf/DwMAQzcDAEIJkCcU+QTccBqhiCS7DSbKEBY8F3xkYGP4yMDDEMzAwLMUivwZKL4OqJQtoU0nNKBgFIxoAAB9QH6Lnr4NuAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIwLTAzLTI0VDAzOjA4OjIyKzAwOjAw1GAGdQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMC0wMy0yNFQwMzowODoyMiswMDowMKU9vskAAAAodEVYdHN2ZzpiYXNlLXVyaQBmaWxlOi8vL3RtcC9tYWdpY2stdUlSbUd6dzAlkOBOAAAAAElFTkSuQmCC');
}


.backdrop-container {
    position: absolute;
    top: 0px;
    z-index: 0;
    overflow: hidden;
    width: 100vw;
    height: 675px;
}

.backdrop-wrapper {
    position: absolute;
    z-index: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 675px;
}

.backdrop-wrapper > .backdropimage {
    position: absolute;
    width: 100%;
    height: 99.95%;
    background-position: center 0px;
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.backdrop-wrapper > .backdropmask {
    padding-top: 500px;
    position: relative
}

.backdrop-wrapper > .backdropmask:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    pointer-events: none;
    width: 100vw;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 675px;
    background-repeat: no-repeat;
    /*background-image: linear-gradient(90deg,#14181d 0,rgba(20,24,29,.98556487) .97%,rgba(20,24,29,.9451312) 2.07833333%,rgba(20,24,29,.88300656) 3.29666667%,rgba(20,24,29,.80349854) 4.60166667%,rgba(20,24,29,.71091472) 5.96666667%,rgba(20,24,29,.60956268) 7.365%,rgba(20,24,29,.50375) 8.77166667%,rgba(20,24,29,.39778426) 10.16%,rgba(20,24,29,.29597303) 11.505%,rgba(20,24,29,.20262391) 12.78%,rgba(20,24,29,.12204446) 13.95833333%,rgba(20,24,29,.05854227) 15.01666667%,rgba(20,24,29,.01642493) 15.92833333%,rgba(20,24,29,0) 16.66666667%,rgba(20,24,29,0) 83.33333333%,rgba(20,24,29,.01642493) 84.07166667%,rgba(20,24,29,.05854227) 84.98333333%,rgba(20,24,29,.12204446) 86.04166667%,rgba(20,24,29,.20262391) 87.22%,rgba(20,24,29,.29597303) 88.495%,rgba(20,24,29,.39778426) 89.84%,rgba(20,24,29,.50375) 91.22833333%,rgba(20,24,29,.60956268) 92.635%,rgba(20,24,29,.71091472) 94.03333333%,rgba(20,24,29,.80349854) 95.39833333%,rgba(20,24,29,.88300656) 96.70333333%,rgba(20,24,29,.9451312) 97.92166667%,rgba(20,24,29,.98556487) 99.03%,#14181d),linear-gradient(0deg,#14181d 0,#14181d 21.48148148%,rgba(20,24,29,.98556487) 23.63703704%,rgba(20,24,29,.9451312) 26.1%,rgba(20,24,29,.88300656) 28.80740741%,rgba(20,24,29,.80349854) 31.70740741%,rgba(20,24,29,.71091472) 34.74074074%,rgba(20,24,29,.60956268) 37.84814815%,rgba(20,24,29,.50375) 40.97407407%,rgba(20,24,29,.39778426) 44.05925926%,rgba(20,24,29,.29597303) 47.04814815%,rgba(20,24,29,.20262391) 49.88148148%,rgba(20,24,29,.12204446) 52.5%,rgba(20,24,29,.05854227) 54.85185185%,rgba(20,24,29,.01642493) 56.87777778%,rgba(20,24,29,0) 58.51851852%)*/
    background: linear-gradient( to top, rgba(0,0,0, 1) 0, rgba(0,0,0, 0.6) 25%, rgba(0,0,0, 0) 45% ) center no-repeat;
}

.backdrop-container + div.content {
    margin-top: 470px;
}

#article table {
    border-spacing: 0px;
    border: solid 1px #bbb;
    border-radius: 3px;
    margin-bottom: 20px;
    width: 100%;
    font-size: small;
    line-height: normal;
}

#article th {
    background-color: #cccccc70;
    border-right: solid 1px #ccc;
    padding: 5px;
}

#article th:last-child {
    border-right: none;
}

#article td {
    border-bottom: solid 1px #efefef;
    border-right: solid 1px #efefef;
    padding: 5px;
}

#article td:hover {
    background-color: #efefef;
}

#article td:last-child {
    border-right: none;
}









/* === Image and Video Lists === */
.img_row_scroll {
    height: 260px;
    overflow-x: auto;
    overflow-y: hidden;
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
}

/* Thin scrollbar in Firefox only, webkit uses classes below */
@-moz-document url-prefix() {
    .img_row_scroll {
        scrollbar-width: thin;
    }
}

.img_row_scroll::-webkit-scrollbar {
    height: 8px;
    width: 4px;
    background: gray;
}

/* Track */
.img_row_scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
    padding-top:10px;
    padding-bottom: 10px;
}

/* Handle */
.img_row_scroll::-webkit-scrollbar-thumb {
    background: #bbb;
    cursor: grab;
}

.img_row_scroll::-webkit-scrollbar-thumb:horizontal {
    background: #bbb;
    border-radius: 10px;
}

.img_row_scroll::-webkit-scrollbar-thumb:horizontal:hover {
    background: #000;
    border-radius: 10px;
}

.img_cat_list {
    /*margin: 30px 0px 0px -10px;*/
    margin: 0px 0px 0px -10px;
}

.img_cat_header {
    font-size: 13px;
    font-weight: 500;
    margin-left: 10px;
    line-height: initial;
}

#articleTabContent .img_cat_header a {
    text-decoration: none !important;
    color: #fff;
    font-size: 13px;
}

.img_cat_header.empty {
    text-align: center;
    height: 140px;
    padding-top: 60px;
    line-height: inherit;
}

.img_cat_header .add-new {
    display: inline-block;
    letter-spacing: initial;
    position: fixed;
    right: 35px;
}

.img_cat_header .add-new a {
    text-decoration: none !important;
    color: #0088cc;
    font-size: 12px;
}

.img_cat_header .view-all svg {
    width: 24px;
    height: 24px;
    fill: #616161;
}

.img_cat_header .view-all:hover svg {
    fill: #0088cc;
}

.img_cat {
    position: relative;
    display: inline-block;
    width: 128px;
    padding: 10px;
    border-radius: 8px;
    vertical-align: top;
    user-select: none;
}

.img_cat:hover {
    background-color: #f0f0f0;
}

.img_cat.view_all:hover {
    background-color: #f6f6f6;
}

.img_cat.view_all .img_cat_thumb {
    background-color: #efefef;
}

.img_cat.view_all:hover .img_cat_thumb {
    background-color: #ddd;
}

.img_cat a {
    text-decoration: none !important;
    display: block;
/*    height: 100%;*/
}

.img_cat_thumb {
    background-color: #ccc;
    border-radius: 8px;
    height: 0;
    padding-bottom: 100%;
    position: relative;
    transition: all .135s cubic-bezier(0,0,.2,1);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}

.list-actions-menu {
    position: absolute;
    top: 235px;
    right: 4px;
}
/*.img_cat.book {
    width: initial;
}*/
.img_cat_thumb.pdf {
    border: solid 1px #ccc;
}

.img_cat_thumb.book {
    background-color: initial;
    border: none;
    border-radius: inherit;
    height: 160px;
    width: 100%;
    padding-bottom: 0;
}

.img_cat_thumb.book:hover {
    background-color: initial;
}

.img_cat_thumb.book img {
    max-height: 160px;
}

.img_cat_name {
    text-decoration: none;
    color: #3a3a3a;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    padding-top: 6px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

/*.img_cat.news .img_cat_name {
    font-size: 13px;
    height: 49px;
}*/

.img_cat_count {
    text-decoration: none;
    font-size: 10px;
    line-height: 18px;
    color: #858585;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
}

.img_cat_count.news {
    margin-top: 10px;
}

.img_cat_count img {
    width: 16px;
    height: 16px;
    margin-right: 4px;
}

.img_cat_count .news-date {
    position: absolute;
    right: 10px;
}

#logoutForm {
   margin: 0;
}

/* === End Image and Video Lists === */












/* === Quick Facts Box === */
table.infobox {
    width: 250px;
    float: right;
    padding: 0 0 10px 20px;
    font-size: 13px;
    border-spacing: 0px;
    background-color: #14181c;
    display:none;
}

.infobox .image {
    width: 102%;
    border: solid 1px #cccccc8a;
}

.infobox td {
    vertical-align: text-top;
    border-bottom: solid 1px #464646;
    padding: 6px 0 6px 0;
}

.infobox tr td:first-child {
    color: #888;
    padding-right: 8px;
    font-size: 12px;
    white-space: nowrap;
}

.infobox ul {
    margin: 0px;
    padding-left: 0px;
}

.infobox li {
    display: inline-block;
    margin-right: 8px;
}

.infobox li:last-child:after {
    content: none;
}

.infobox li:after {
    content: '•';
    padding-left: 8px;
    font-size: 1em;
    line-height: 1;
}

#quick-facts-collapsible {
    background-color: #333;
    padding: 8px;
    border-radius: 4px;
    cursor: pointer;
    display: none;
}

#quick-facts-collapsible svg {
    fill: #bbb;
    float: right;
    margin-left: 5px;
}

#quick-facts-collapsible:hover {
    background-color: #444;
}

#quick-facts-collapsible:hover svg {
    fill: #eee;
}

/* === End Quick Facts Box === */

/* === Tabs === */

.tab {
    overflow: hidden;
    border-bottom: 1px solid #cccccc8a;
}

.tab a {
    display: inline-block;
    text-align: center;
    background-color: inherit;
    color: #ffffff8a;
    font-size: 16px;
    min-width: 60px;
    border: none;
    border-bottom: solid 4px transparent;
    outline: none;
    cursor: pointer;
    padding: 10px 16px;
    transition: 0.3s;
}

.tab a:hover {
font-weight: bold;
    color: #ff0000;
}

.tab a.active {
    font-weight: bold;
    color: #fff;
    border-bottom: solid 4px #ff0000;
}

.tabcontent {
    display: none;
    border-top: none;
}

/* === End Tabs === */

/* === Image Grid === */
.grid-container {
    display: grid;
    column-gap: 4px;
    row-gap: 10px;
    /*grid-template-columns: auto auto auto auto auto;*/
    grid-template-columns: repeat(auto-fit, minmax(min-content, 160px));
    background-color: transparent;
    padding: 10px 0 10px 0;
    max-width: 1200px;
    margin: 0px auto;
}

.grid-item {
    position: relative;
    /*background-color: rgba(255, 255, 255, 0.8);*/
    /*border: 1px solid rgba(0, 0, 0, 0.8);*/
    /*text-align: center;*/
    aspect-ratio: 0.7;
    max-height: 220px;
}

/* If the browser window is 600px or smaller */
@media only screen and (max-width: 1000px) {
    .grid-container {
        /*grid-template-columns: auto auto auto auto;*/
    }
}

@media only screen and (max-width: 820px) {
    .grid-container {
        /*grid-template-columns: auto auto auto;*/
    }
}
/* === End Image Grid === */


/* === Horizontal Thumb Gallery Scroller === */
.view-all-link {
    float: right;
    font-size: 0.7em;
    margin-top: 3px;
}

.thumb-gallery {
    scrollbar-color: #888 #f1f1f1;
    scrollbar-width: thin;
    overflow-y: hidden;
    display: flex;
    overflow-x: auto;
    position: relative;
}

.thumb-gallery::-webkit-scrollbar {
    width: 5px;
    height: 10px;
}

.thumb-gallery::-webkit-scrollbar-track {
    background: #222;
}

.thumb-gallery::-webkit-scrollbar-thumb {
    background: #f1f1f1;
    border-radius: 4px;
    background: #ffffff40;
}

.thumb-gallery::-webkit-scrollbar-thumb:hover {
    background: #ffffff;
}

.thumb-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
}

.thumb-scroll {
    position: fixed;
    z-index: 10;
    fill: #fff;
    cursor: pointer;
    height: 205px;
    width: 40px;
}
.thumb-scroll:hover {
    background-color: #000000bd;
}

.thumb-scroll.lscroll {
    left: 20px;

}
.thumb-scroll.rscroll {
    right: 20px;
}


a.scroll-box {
    display: inline-block;
    position: relative;
    user-select: none;
    width: 150px;
    height: 220px;
    background-size: cover;
    margin-right: 6px;
    border-radius: 6px;
}

.scroll-box:hover {
    opacity: 0.7;
}




a.thumb-box {
    display: block;
    text-decoration: none;
    user-select: none;
    width: 100%;
    height: 100%;
    background-size: cover;
    border-radius: 6px;
}

.thumb-box:hover {
    opacity: 0.7;
}

.thumb-text {
    color: #fff;
    padding: 12px 8px;
    background-image: linear-gradient(to top,rgba(0,0,0,0.8) 0,transparent 100%);
    position: absolute;
    top: initial;
    left: 0px;
    bottom: 0;
    right: 0;
    width: initial;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.thumb-t1 {
    font-size: 0.875rem;
    font-weight: bold;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    height: 22px;
}

.thumb-t2 {
    font-size: 0.7rem;
    /*padding-top: 4px;*/
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 20px;
}

#alpha {
    position: fixed;
    right: 10px;
    margin-top: 0;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    text-align: -webkit-center;
}

#alpha li {
    display: table;
}

#alpha li a {
    width: 12px;
    padding: 6px 8px;
    display: block;
    cursor: pointer;
}

#alpha li a:hover, #alpha li a.selected {
    background-color: #ffffff4d;
    border-radius: 4px;
    text-decoration: none;
}
/* === End Horizontal Thumb Scroller === */








/* === Left Menu === */
.sidenav {
    height: 100%;
    /*width: 0;*/
    width: 0px;
    position: fixed;
    z-index: 1040;
    top: 0;
    left: -1px;
    background-color: #fff;
    overflow-x: hidden;
    /*padding-top: 3px;*/
    transition: width .4s cubic-bezier(0.24,1,0.32,1);
    -webkit-box-shadow: 0 8px 17px rgba(0,0,0,0.2);
    box-shadow: 0 8px 17px rgba(0,0,0,0.2);
}

.sidenav.open {
    width: 295px;
}

.sidenav a {
    padding: 10px 8px 10px 55px;
    text-decoration: none;
    font-size: 15px;
    color: #353535;
    display: block;
    width: 290px;
}

.sidenav a:last-child {
    margin-bottom: 50px;
}

.sidenav a:hover {
    color: #000;
    background-color: #f6f6f6;
    text-decoration: none !important;
}

.sidenav svg {
    position: absolute;
    left: 17px;
    fill: #ddd;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

.sidenav-seperator {
    height: 1px;
    background-color: #ccc;
}

.sidenav-menuitem {
    cursor: pointer;
    border-bottom: solid 1px #444;
    margin-bottom: 10px;
    padding: 10px 8px 10px 55px;
    text-decoration: none;
    font-size: 15px;
    color: #ddd;
    display: block;
    width: 290px;
}

.sidenav .selected {
    background-color: #e0e0e0;
    color: #000;
    border-left: solid 4px #ff2a05;
    padding-left: 51px;
}

.sidenav .selected svg {
    fill: #000;
}





#topToolbar {
    width: 100%;
    top: 0px;
    z-index: 10;
    height: 50px;
    background-color: #fff;
    position: fixed;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1);
}

#topToolbar.transparent {
    background-color: transparent;
    box-shadow: inset 0px 20px 10px 11px #0000003d;
}

#topToolbar.transparent:not(.scrolled) svg {
    fill: #fff;
}

#topToolbar.scrolled {
    background-color: #fff;
    transition: background-color 400ms ease-out;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1);
}

#topToolbar.scrolled::after {
    -webkit-box-shadow: 0 2px 3px rgb(0 0 0 / 10%);
    box-shadow: 0 2px 3px rgb(0 0 0 / 10%);
    content: "";
    display: block;
    height: 3px;
    left: 0;
    opacity: 0;
    position: absolute;
    top: -webkit-calc(100% - 3px);
    top: calc(100% - 3px);
    -webkit-transition: opacity 300ms ease-out 0ms;
    transition: opacity 300ms ease-out 0ms;
    width: 100%;
}

#rightToolbar {
    position: absolute;
    right: 6px;
    top: 6px;
}

#searchBtn {
    /*position: absolute;
    right: 75px;
    top: 10px;*/
    display: inline-block;
    vertical-align: middle;
    z-index: 2;
}

#searchBtn a {
    padding: 6px;
}

#loginBtn {
    display: inline-block;
    margin-right: 4px;
    z-index: 2;
    border-radius: 6px;
    background-color: #ffffff3d;
    border: none;
    padding: 0px 8px;
}

#loginBtn a {
    font-size: 13.5px;
    text-decoration: none;
    line-height: inherit;
}

#loginBtn span {
    vertical-align: top;
    color: #fff;
}

#accountBtn {
/*    position: absolute;
    right: 10px;
    top: 6px;*/
    display: inline-block;
    /*margin: -4px 2px 0px -4px;*/
    z-index: 2;
}

#accountBtn button {
    padding: 4px;
}

.mobileSideNavBtn {
    position: absolute;
    left: 6px;
    /*top: 3px;*/
    display: block;
    cursor: pointer;
    z-index: 2;
    padding: 10px;
}



#backNavBtn {
    position: absolute;
    left: 52px;
    top: 10px;
    z-index: 2;
    outline: none;
}

#backNavBtn a {
    padding : 10px;
}

#headerLogo {
    display: block;
    padding-top: 10px;
    width: 120px;
    text-align: center;
    margin: auto;
}

a.footnote-ref {
    padding-left: 2px;
    padding-right: 2px;
    font-size: 12px;
    text-decoration: none;
}

a.footnote-ref:hover {
    background-color: #ccc;
}

.tab-pane {
    padding: 10px 16px 0 16px;
    border-radius: 6px;
}




/* ---------- FancyBox Image Viewer ----------- */
.fancybox__container {
    --right-col-width: 0px;
}

    .fancybox__container.has-sidebar {
        --right-col-width: clamp(150px, 20vw, 300px);
    }

.fancybox__cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--right-col-width);
    height: 100%;
}

.fancybox__col {
    display: flex;
    flex-direction: column;
    min-height: 0;
    position: relative;
    overflow: hidden;
}

.fancybox__data {
    padding: 10px 1rem;
    overflow: auto;
}

.f-button {
    box-sizing: content-box;
}

.fancybox__nav .f-button:before {
    padding: 100px 60px;
}

.fancybox__nav .f-button:before {
    top: -70px;
    right: -30px;
    left: -30px;
    bottom: -30px;
}

.fancybox__container, .fancybox__backdrop {
    background-color: #000;
}

#imgInfoHeader {
    font-weight: 400;
    font-size: 20px;
    color: #000;
}

.imgInfoBoxClose {
    padding: 8px;
    margin-left: -14px;
}

.imgInfoBoxClose svg {
    width: 24px;
    height: 24px;
    fill: #000;
    vertical-align: text-bottom;
}

.imgInfoBoxClose:hover {
    border-radius: 22px;
    background-color: #cccccc61;
}

.imgInfoTitle {
    font-size: 11px;
    line-height: 14px;
    color: #777;
}

.imgInfoText {
    font-size: 14px;
    line-height: 20px;
    padding-bottom: 18px;
    text-transform: capitalize;
    color: #000;
}

#imgInfoDetailsBox {
    margin-top: 30px;
}

.img-container {
    position: relative;
    display: inline-block;
}

.img-actions {
    position: absolute;
    right: 4px;
    bottom: 0px;
}


/* ---------- FancyBox Image Viewer ----------- */



/* ---------- TypeAhead Dropdown ----------- */

.typeahead,
.tt-query,
.tt-hint {
    width: 496px;
    height: 30px;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 16px;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    outline: none;
}

.typeahead {
    background-color: #fff;
}

.typeahead:focus {
    border: 2px solid #0097cf;
}

.tt-query {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: #999;
}

.tt-menu {
    width: 522px;
    margin: 0;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
    padding: 3px 20px;
    font-size: 12px;
    line-height: 16px;
}

.tt-suggestion:hover {
    cursor: pointer;
    color: #fff;
    background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
    color: #fff;
    background-color: #0097cf;
}

.tt-suggestion p {
    margin: 0;
}
/* ---------- TypeAhead Dropdown ----------- */





/* If the browser window is 600px or smaller */
@media only screen and (max-width: 600px) {
    .sidenav {
        width: 0px;
    }

    /*.mobileSideNavBtn {
        position: absolute;
        left: 10px;
        top: 10px;
        display: block;
        cursor: pointer;
        z-index: 2;
    }*/

    /*.backNavBtn {
        left: 12px;
        top: 12px;
    }*/

    /*header {
        width: calc(100%);
        margin-left: 0px;
    }*/

    .nav-tabs {
        padding-left: 0px !important;
    }

    .tab-pane {
        padding: 6px;
    }

    .thumb-gallery {
        width: calc(100vw - 60px);
    }

    #quick-facts-collapsible {
        display: block;
    }
    table.infobox {
        width: 100%;
        margin-left: 0px;
        display: none;
    }

    #article-desc {
        font-size: 13px;
        font-style: italic;
        margin-bottom: unset;
        margin-right: 100px;
    }

    #title-div.hero-image #breadcrumbs {
        position: absolute;
        top: 70px;
        font-size: 12px;
        line-height: 18px;
        white-space: normal;
        margin-right: initial; 
        padding-top: 5px;
    }

}

/*********************** Dark Theme ***********************/

body.dark {
    background-color: #14181d;
    /*color: #eee;*/
    color: #9ab;
}

body.dark .tab-pane {
    background-color: #cccccc17;
}

body.dark .progress {
    background-color: unset;
    background-image: none;
}

body.dark #mySidenav {
    background-color: #151515;
    border-right: solid 1px #444;
}

body.dark #topToolbar {
    background-color: #14181d;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1);
}

body.dark #topToolbar svg {
    fill: #fff;
}

body.dark #topToolbar.transparent {
    background-color: unset;
    box-shadow: none;
}

body.dark #topToolbar.scrolled {
    background-color: unset;
    transition: background-color 400ms ease-out;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(10px);
    border-bottom: solid 1px #cccccc1a;
}

body.dark .sidenav-seperator {
    background-color: #555;
}

body.dark .sidenav a {
    color: #ddd !important;
}

body.dark .sidenav a:hover {
    color: #fff !important;
    background-color: #7373735e !important;
}

body.dark .sidenav a:hover svg {
    fill: #fff;
}

body.dark #toparrow svg {
    fill: #fff;
}

body.dark .dropdown-toggle svg {
    fill: #fff;
}

body.dark #article-header {
    background-color: unset;
}

body.dark #title-block {
    color: #fff
}

body.dark li.is-active-li a.toc-link {
    color: #fff;
}

body.dark a.toc-link {
    color: #848484;
}

body.dark a.toc-link:hover {
    color: #fff;
    text-decoration: none;
}

body.dark .toc-link::before {
    background-color: #454545;
}

body.dark .is-active-link::before {
    background-color: #ff3333;
}

body.dark a, body.dark .article #breadcrumbs a {
    color: #e8f4ff;
    text-decoration: none;
}

body.dark a:hover, body.dark .article a:hover {
    text-decoration: underline;
}

body.dark p.note {
    background-color: #14253b;
}

body.dark .img_cat:hover .img_cat_name {
    color: #3e3e3e;
}

body.dark .img_cat_name {
    color: #ebebeb;
}

body.dark h2.collapsible {
    border-bottom: solid 1px #66666682;
    font-size: 1.3em;
}

body.dark h2.collapsible:before {
    content: ' ';
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAdElEQVRIx+2PsQ3CQBAER4Z2XI4z+iD0uxNHlEhiS0NggkfiPjCfcRPvzd5CkiRN1LFHJjpc1F29NTKTuqklygyNjidwAdZvJeoEPIAr4NkVdw8+llSfq86n5FFJV3lVUt7CrZKXn8XBkn6fB0v6fp4kf8ALZ8WNp4VXQsoAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjAtMTItMDRUMjI6NDE6NTkrMDA6MDDKLzUvAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIwLTEyLTA0VDIyOjQxOjU5KzAwOjAwu3KNkwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAASUVORK5CYII=');
}

body.dark h2.collapsible.active:before {
    content: ' ';
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAbElEQVRIx+2PMQqAMBAE98Df+B07C7+S0o9o5f8sVMZGIQgKMbHyBtLkjhlOchwnCSAA/Zfyk7KRSL4cDyCUlq9ACzRRJO+Sqzz6z4/cyVMj1UNjlrRJ6sxsuA7NbAIkaTx2X11Rl9hxnL+zA2UblDOVv1XrAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIwLTEyLTA0VDIyOjQwOjMwKzAwOjAwdhoSRQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMC0xMi0wNFQyMjo0MDozMCswMDowMAdHqvkAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC');
}

body.dark li.ais-Hits-item {
    background-color: unset;
}

body.dark #article table {
    border: solid 1px #555;
}

body.dark #article th {
    background-color: rgb(37 36 45);
    border-right: solid 1px #555;
}

body.dark #article td {
    border-bottom: solid 1px #555;
    border-right: solid 1px #555;
}

body.dark #article td:hover {
    background-color: unset;
}


#backdrop-mask:before {
    background-image: linear-gradient(90deg, #14181d 0, rgba(20, 24, 29, .986) .97%, rgba(20, 24, 29, .945) 2.07833333%, rgba(20, 24, 29, .883) 3.29666667%, rgba(20, 24, 29, .803) 4.60166667%, rgba(20, 24, 29, .711) 5.96666667%, rgba(20, 24, 29, .61) 7.365%, rgba(20, 24, 29, .504) 8.77166667%, rgba(20, 24, 29, .398) 10.16%, rgba(20, 24, 29, .296) 11.505%, rgba(20, 24, 29, .203) 12.78%, rgba(20, 24, 29, .122) 13.95833333%, rgba(20, 24, 29, .059) 15.01666667%, rgba(20, 24, 29, .016) 15.92833333%, rgba(20, 24, 29, 0) 16.66666667%, rgba(20, 24, 29, 0) 83.33333333%, rgba(20, 24, 29, .016) 84.07166667%, rgba(20, 24, 29, .059) 84.98333333%, rgba(20, 24, 29, .122) 86.04166667%, rgba(20, 24, 29, .203) 87.22%, rgba(20, 24, 29, .296) 88.495%, rgba(20, 24, 29, .398) 89.84%, rgba(20, 24, 29, .504) 91.22833333%, rgba(20, 24, 29, .61) 92.635%, rgba(20, 24, 29, .711) 94.03333333%, rgba(20, 24, 29, .803) 95.39833333%, rgba(20, 24, 29, .883) 96.70333333%, rgba(20, 24, 29, .945) 97.92166667%, rgba(20, 24, 29, .986) 99.03%, #14181d), linear-gradient(1deg, #14181d 0, #14181d 0%, rgba(20, 24, 29, 0) 30%);
    background-repeat: no-repeat;
    content: "";
    display: block;
    height: 75vw;
    max-height: 500px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 1200px;
}

#backdrop-mask.dark:before {
    background-image: linear-gradient(90deg, #14181d 0, rgba(20, 24, 29, .986) .97%, rgba(20, 24, 29, .945) 2.07833333%, rgba(20, 24, 29, .883) 3.29666667%, rgba(20, 24, 29, .803) 4.60166667%, rgba(20, 24, 29, .711) 5.96666667%, rgba(20, 24, 29, .61) 7.365%, rgba(20, 24, 29, .504) 8.77166667%, rgba(20, 24, 29, .398) 10.16%, rgba(20, 24, 29, .296) 11.505%, rgba(20, 24, 29, .203) 12.78%, rgba(20, 24, 29, .122) 13.95833333%, rgba(20, 24, 29, .059) 15.01666667%, rgba(20, 24, 29, .016) 15.92833333%, rgba(20, 24, 29, 0) 16.66666667%, rgba(20, 24, 29, 0) 83.33333333%, rgba(20, 24, 29, .016) 84.07166667%, rgba(20, 24, 29, .059) 84.98333333%, rgba(20, 24, 29, .122) 86.04166667%, rgba(20, 24, 29, .203) 87.22%, rgba(20, 24, 29, .296) 88.495%, rgba(20, 24, 29, .398) 89.84%, rgba(20, 24, 29, .504) 91.22833333%, rgba(20, 24, 29, .61) 92.635%, rgba(20, 24, 29, .711) 94.03333333%, rgba(20, 24, 29, .803) 95.39833333%, rgba(20, 24, 29, .883) 96.70333333%, rgba(20, 24, 29, .945) 97.92166667%, rgba(20, 24, 29, .986) 99.03%, #14181d), linear-gradient(0deg, #14181d 0, #14181d 21.48148148%, rgba(20, 24, 29, .986) 23.63703704%, rgba(20, 24, 29, .945) 26.1%, rgba(20, 24, 29, .883) 28.80740741%, rgba(20, 24, 29, .803) 31.70740741%, rgba(20, 24, 29, .711) 34.74074074%, rgba(20, 24, 29, .61) 37.84814815%, rgba(20, 24, 29, .504) 40.97407407%, rgba(20, 24, 29, .398) 44.05925926%, rgba(20, 24, 29, .296) 47.04814815%, rgba(20, 24, 29, .203) 49.88148148%, rgba(20, 24, 29, .122) 52.5%, rgba(20, 24, 29, .059) 54.85185185%, rgba(20, 24, 29, .016) 56.87777778%, rgba(20, 24, 29, 0) 58.51851852%);
    background-repeat: no-repeat;
    content: "";
    display: block;
    height: 75vw;
    max-height: 500px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 1200px;
}