:root{--cc-bg:#fff;--cc-text:#2d4156;--cc-btn-primary-bg:#2d4156;--cc-btn-primary-text:var(--cc-bg);--cc-btn-primary-hover-bg:#1d2e38;--cc-btn-secondary-bg:#eaeff2;--cc-btn-secondary-text:var(--cc-text);--cc-btn-secondary-hover-bg:#d8e0e6;--cc-toggle-bg-off:#919ea6;--cc-toggle-bg-on:var(--cc-btn-primary-bg);--cc-toggle-bg-readonly:#d5dee2;--cc-toggle-knob-bg:#fff;--cc-toggle-knob-icon-color:#ecf2fa;--cc-block-text:var(--cc-text);--cc-cookie-category-block-bg:#f0f4f7;--cc-cookie-category-block-bg-hover:#e9eff4;--cc-section-border:#f1f3f5;--cc-cookie-table-border:#e9edf2;--cc-overlay-bg:rgba(4,6,8,.85);--cc-webkit-scrollbar-bg:#cfd5db;--cc-webkit-scrollbar-bg-hover:#9199a0}.c_darkmode{--cc-bg:#181b1d;--cc-text:#d8e5ea;--cc-btn-primary-bg:#a6c4dd;--cc-btn-primary-text:#000;--cc-btn-primary-hover-bg:#c2dff7;--cc-btn-secondary-bg:#33383c;--cc-btn-secondary-text:var(--cc-text);--cc-btn-secondary-hover-bg:#3e454a;--cc-toggle-bg-off:#667481;--cc-toggle-bg-on:var(--cc-btn-primary-bg);--cc-toggle-bg-readonly:#454c54;--cc-toggle-knob-bg:var(--cc-cookie-category-block-bg);--cc-toggle-knob-icon-color:var(--cc-bg);--cc-block-text:#b3bfc5;--cc-cookie-category-block-bg:#23272a;--cc-cookie-category-block-bg-hover:#2b3035;--cc-section-border:#292d31;--cc-cookie-table-border:#2b3035;--cc-webkit-scrollbar-bg:#667481;--cc-webkit-scrollbar-bg-hover:#9199a0}.cc_div *,.cc_div :after,.cc_div :before,.cc_div :hover{animation:none;background:none;border:none;border-radius:unset;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;float:none;font-family:inherit;font-size:1em;font-style:inherit;font-variant:normal;font-weight:inherit;height:auto;letter-spacing:unset;line-height:1.2;margin:0;padding:0;text-align:left;text-decoration:none;text-transform:none;transition:none;vertical-align:baseline;visibility:unset}.cc_div{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;color:#2d4156;color:var(--cc-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:16px;font-weight:400}#c-ttl,#s-bl td:before,#s-ttl,.cc_div .b-tl,.cc_div .c-bn{font-weight:600}#cm,#s-bl .act .b-acc,#s-inr,.cc_div .b-tl,.cc_div .c-bl{border-radius:.35em}#s-bl .act .b-acc{border-top-left-radius:0;border-top-right-radius:0}.cc_div a,.cc_div button,.cc_div input{-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}.cc_div a{border-bottom:1px solid}.cc_div a:hover{border-color:transparent;text-decoration:none}#cm-ov,#cs-ov,.c--anim #cm,.c--anim #s-cnt,.c--anim #s-inr{transition:visibility .25s linear,opacity .25s ease,transform .25s ease!important}.c--anim .c-bn{transition:background-color .25s ease!important}.c--anim #cm.bar.slide,.c--anim #cm.bar.slide+#cm-ov,.c--anim .bar.slide #s-inr,.c--anim .bar.slide+#cs-ov{transition:visibility .4s ease,opacity .4s ease,transform .4s ease!important}#cm.bar.slide,.cc_div .bar.slide #s-inr{opacity:1;transform:translateX(100%)}#cm.bar.top.slide,.cc_div .bar.left.slide #s-inr{opacity:1;transform:translateX(-100%)}#cm.slide,.cc_div .slide #s-inr{transform:translateY(1.6em)}#cm.top.slide{transform:translateY(-1.6em)}#cm.bar.slide{transform:translateY(100%)}#cm.bar.top.slide{transform:translateY(-100%)}.show--consent .c--anim #cm,.show--consent .c--anim #cm.bar,.show--settings .c--anim #s-inr,.show--settings .c--anim .bar.slide #s-inr{opacity:1;transform:scale(1);visibility:visible!important}.show--consent .c--anim #cm.box.middle,.show--consent .c--anim #cm.cloud.middle{transform:scale(1) translateY(-50%)}.show--settings .c--anim #s-cnt{visibility:visible!important}.force--consent.show--consent .c--anim #cm-ov,.show--settings .c--anim #cs-ov{opacity:1!important;visibility:visible!important}#cm{background:#fff;background:var(--cc-bg);bottom:1.25em;box-shadow:0 .625em 1.875em #000;box-shadow:0 .625em 1.875em rgba(2,2,3,.28);font-family:inherit;line-height:normal;max-width:24.2em;opacity:0;padding:1.1em 1.5em 1.4em;position:fixed;right:1.25em;transform:scale(.95);visibility:hidden;width:100%;z-index:1}#cc_div #cm{display:block!important}#c-ttl{font-size:1.05em;margin-bottom:.7em}.cloud #c-ttl{margin-top:-.15em}#c-txt{font-size:.9em;line-height:1.5em}.cc_div #c-bns{display:flex;justify-content:space-between;margin-top:1.4em}.cc_div .c-bn{background:#e5ebef;background:var(--cc-btn-secondary-bg);border-radius:4px;color:#40505a;color:var(--cc-btn-secondary-text);cursor:pointer;display:inline-block;flex:1;font-size:.82em;padding:1em 1.7em;text-align:center;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;user-select:none}#c-bns button+button,#s-c-bn,#s-cnt button+button{float:right;margin-left:1em}#s-cnt #s-rall-bn{float:none}#cm .c_link:active,#cm .c_link:hover,#s-c-bn:active,#s-c-bn:hover,#s-cnt button+button:active,#s-cnt button+button:hover{background:#d8e0e6;background:var(--cc-btn-secondary-hover-bg)}#s-cnt{display:table;height:100%;left:0;position:fixed;top:0;visibility:hidden;width:100%;z-index:101}#s-bl{outline:none}#s-bl .title{margin-top:1.4em}#s-bl .b-bn,#s-bl .title:first-child{margin-top:0}#s-bl .b-acc .p{margin-top:0;padding:1em}#s-cnt .b-bn .b-tl{background:none;display:block;font-family:inherit;font-size:.95em;padding:1.3em 6.4em 1.3em 2.7em;position:relative;transition:background-color .25s ease;width:100%}#s-cnt .b-bn .b-tl.exp{cursor:pointer}#s-cnt .act .b-bn .b-tl{border-bottom-left-radius:0;border-bottom-right-radius:0}#s-cnt .b-bn .b-tl:active,#s-cnt .b-bn .b-tl:hover{background:#e9eff4;background:var(--cc-cookie-category-block-bg-hover)}#s-bl .b-bn{position:relative}#s-bl .c-bl{border:1px solid #f1f3f5;border-color:var(--cc-section-border);margin-bottom:.5em;padding:1em;transition:background-color .25s ease}#s-bl .c-bl:hover{background:#f0f4f7;background:var(--cc-cookie-category-block-bg)}#s-bl .c-bl:last-child{margin-bottom:.5em}#s-bl .c-bl:first-child{border:none;margin-bottom:2em;margin-top:0;padding:0;transition:none}#s-bl .c-bl:not(.b-ex):first-child:hover{background:transparent;background:unset}#s-bl .c-bl.b-ex{background:#f0f4f7;background:var(--cc-cookie-category-block-bg);border:none;padding:0;transition:none}#s-bl .c-bl.b-ex+.c-bl{margin-top:2em}#s-bl .c-bl.b-ex+.c-bl.b-ex{margin-top:0}#s-bl .c-bl.b-ex:first-child{margin-bottom:1em;margin-bottom:.5em}#s-bl .b-acc{display:none;margin-bottom:0;max-height:0;overflow:hidden;padding-top:0}#s-bl .act .b-acc{display:block;max-height:100%;overflow:hidden}#s-cnt .p{color:#2d4156;color:var(--cc-block-text);font-size:.9em;line-height:1.5em;margin-top:.85em}.cc_div .b-tg .c-tgl:disabled{cursor:not-allowed}#c-vln{display:table-cell;position:relative;vertical-align:middle}#cs{bottom:0;left:0;padding:0 1.7em;position:fixed;right:0;top:0;width:100%}#cs,#s-inr{height:100%}#s-inr{box-shadow:0 13px 27px -5px rgba(3,6,9,.26);margin:0 auto;max-width:45em;opacity:0;overflow:hidden;padding-bottom:4.75em;padding-top:4.75em;position:relative;transform:scale(.96);visibility:hidden}#s-bns,#s-hdr,#s-inr{background:#fff;background:var(--cc-bg)}#s-bl{display:block;height:100%;overflow-x:hidden;overflow-y:auto;overflow-y:overlay;padding:1.3em 1.8em;width:100%}#s-bns{border-top:1px solid #f1f3f5;border-color:var(--cc-section-border);bottom:0;height:4.75em;left:0;padding:1em 1.8em;position:absolute;right:0}.cc_div .cc-link{border-bottom:1px solid #253b48;border-color:var(--cc-btn-primary-bg);color:#253b48;color:var(--cc-btn-primary-bg);cursor:pointer;display:inline;font-weight:600;padding-bottom:0;text-decoration:none}.cc_div .cc-link:active,.cc_div .cc-link:hover{border-color:transparent}#c-bns button:first-child,#s-bns button:first-child{background:#253b48;background:var(--cc-btn-primary-bg);color:#fff;color:var(--cc-btn-primary-text)}#c-bns.swap button:first-child{background:#e5ebef;background:var(--cc-btn-secondary-bg);color:#40505a;color:var(--cc-btn-secondary-text)}#c-bns.swap button:last-child{background:#253b48;background:var(--cc-btn-primary-bg);color:#fff;color:var(--cc-btn-primary-text)}.cc_div .b-tg .c-tgl:checked~.c-tg{background:#253b48;background:var(--cc-toggle-bg-on)}#c-bns button:first-child:active,#c-bns button:first-child:hover,#c-bns.swap button:last-child:active,#c-bns.swap button:last-child:hover,#s-bns button:first-child:active,#s-bns button:first-child:hover{background:#1d2e38;background:var(--cc-btn-primary-hover-bg)}#c-bns.swap button:first-child:active,#c-bns.swap button:first-child:hover{background:#d8e0e6;background:var(--cc-btn-secondary-hover-bg)}#s-hdr{border-bottom:1px solid #f1f3f5;border-color:var(--cc-section-border);display:table;height:4.75em;padding:0 1.8em;position:absolute;top:0;width:100%;z-index:2}#s-hdr,#s-ttl{vertical-align:middle}#s-ttl{display:table-cell;font-size:1em}#s-c-bn{font-size:1.45em;font-weight:400;height:1.7em;margin:0;overflow:hidden;padding:0;position:relative;width:1.7em}#s-c-bnc{display:table-cell;vertical-align:middle}.cc_div span.t-lb{opacity:0;overflow:hidden;pointer-events:none;position:absolute;top:0;z-index:-1}#c_policy__text{height:31.25em;margin-top:1.25em;overflow-y:auto}#c-s-in{height:100%;height:calc(100% - 2.5em);max-height:37.5em;position:relative;top:50%;transform:translateY(-50%)}@media screen and (min-width:688px){#s-bl::-webkit-scrollbar{background:transparent;border-radius:0 .25em .25em 0;height:100%;width:.9em}#s-bl::-webkit-scrollbar-thumb{background:#cfd5db;background:var(--cc-webkit-scrollbar-bg);border:.25em solid var(--cc-bg);border-radius:100em}#s-bl::-webkit-scrollbar-thumb:hover{background:#9199a0;background:var(--cc-webkit-scrollbar-bg-hover)}#s-bl::-webkit-scrollbar-button{height:5px;width:10px}}.cc_div .b-tg{bottom:0;display:inline-block;margin:auto;right:0;right:1.2em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.cc_div .b-tg,.cc_div .b-tg .c-tgl{cursor:pointer;position:absolute;top:0}.cc_div .b-tg .c-tgl{border:0;display:block;left:0;margin:0}.cc_div .b-tg .c-tg{background:#919ea6;background:var(--cc-toggle-bg-off);pointer-events:none;position:absolute;transition:background-color .25s ease,box-shadow .25s ease}.cc_div .b-tg,.cc_div .b-tg .c-tg,.cc_div .b-tg .c-tgl,.cc_div span.t-lb{border-radius:4em;height:1.5em;width:3.4em}.cc_div .b-tg .c-tg.c-ro{cursor:not-allowed}.cc_div .b-tg .c-tgl~.c-tg.c-ro{background:#d5dee2;background:var(--cc-toggle-bg-readonly)}.cc_div .b-tg .c-tgl~.c-tg.c-ro:after{box-shadow:none}.cc_div .b-tg .c-tg:after{background:#fff;background:var(--cc-toggle-knob-bg);border:none;border-radius:100%;box-shadow:0 1px 2px rgba(24,32,35,.36);box-sizing:content-box;content:"";display:block;height:1.25em;left:.125em;position:relative;top:.125em;transition:transform .25s ease;width:1.25em}.cc_div .b-tg .c-tgl:checked~.c-tg:after{transform:translateX(1.9em)}#s-bl table,#s-bl td,#s-bl th{border:none}#s-bl tbody tr{transition:background-color .25s ease}#s-bl tbody tr:hover{background:#e9eff4;background:var(--cc-cookie-category-block-bg-hover)}#s-bl table{border-collapse:collapse;margin:0;overflow:hidden;padding:0;text-align:left;width:100%}#s-bl td,#s-bl th{font-size:.8em;padding:.8em .625em .8em 1.2em;text-align:left;vertical-align:top}#s-bl th{font-family:inherit;padding:1.2em}#s-bl thead tr:first-child{border-bottom:1px solid #e9edf2;border-color:var(--cc-cookie-table-border)}.force--consent #cs,.force--consent #s-cnt{width:100vw}#cm-ov,#cs-ov{background:#070707;background:rgba(4,6,8,.85);background:var(--cc-overlay-bg);bottom:0;display:none;left:0;opacity:0;position:fixed;right:0;top:0;transition:none;visibility:hidden}.c--anim #cs-ov,.force--consent .c--anim #cm-ov,.force--consent.show--consent #cm-ov,.show--settings #cs-ov{display:block}#cs-ov{z-index:2}.force--consent .cc_div{bottom:0;left:0;position:fixed;top:0;transition:visibility .25s linear;visibility:hidden;width:100%;width:100vw}.force--consent.show--consent .c--anim .cc_div,.force--consent.show--settings .c--anim .cc_div{visibility:visible}.force--consent #cm{position:absolute}.force--consent #cm.bar{max-width:100vw;width:100vw}html.force--consent.show--consent{overflow-y:hidden!important}html.force--consent.show--consent,html.force--consent.show--consent body{height:auto!important;overflow-x:hidden!important}.cc_div .act .b-bn .exp:before,.cc_div .b-bn .exp:before{border:solid #2d4156;border-color:var(--cc-btn-secondary-text);border-width:0 2px 2px 0;content:"";display:inline-block;left:1.2em;margin-right:15px;padding:.2em;position:absolute;top:50%;transform:translateY(-50%) rotate(45deg)}.cc_div .act .b-bn .b-tl:before{transform:translateY(-20%) rotate(225deg)}.cc_div .on-i:before{border:solid #fff;border-color:var(--cc-toggle-knob-icon-color);border-width:0 2px 2px 0;display:inline-block;left:.75em;padding:.1em .1em .45em;top:.37em}#s-c-bn:after,#s-c-bn:before,.cc_div .on-i:before{content:"";margin:0 auto;position:absolute;transform:rotate(45deg)}#s-c-bn:after,#s-c-bn:before{background:#444d53;background:var(--cc-btn-secondary-text);border-radius:1em;height:.6em;left:.82em;top:.58em;width:1.5px}#s-c-bn:after{transform:rotate(-45deg)}.cc_div .off-i,.cc_div .on-i{display:block;height:100%;position:absolute;right:0;text-align:center;transition:opacity .15s ease;width:50%}.cc_div .on-i{left:0;opacity:0}.cc_div .off-i:after,.cc_div .off-i:before{background:#cdd6dc;background:var(--cc-toggle-knob-icon-color);content:" ";display:block;height:.7em;margin:0 auto;position:absolute;right:.8em;top:.42em;transform-origin:center;width:.09375em}.cc_div .off-i:before{transform:rotate(45deg)}.cc_div .off-i:after{transform:rotate(-45deg)}.cc_div .b-tg .c-tgl:checked~.c-tg .on-i{opacity:1}.cc_div .b-tg .c-tgl:checked~.c-tg .off-i{opacity:0}#cm.box.middle,#cm.cloud.middle{bottom:auto;top:50%;transform:translateY(-37%)}#cm.box.middle.zoom,#cm.cloud.middle.zoom{transform:scale(.95) translateY(-50%)}#cm.box.center,#cm.cloud{left:1em;margin:0 auto;right:1em}#cm.cloud{max-width:50em;overflow:hidden;padding:1.3em 2em;text-align:center;width:unset}.cc_div .cloud #c-inr{display:table;width:100%}.cc_div .cloud #c-inr-i{display:table-cell;padding-right:2.4em;vertical-align:top;width:70%}.cc_div .cloud #c-txt{font-size:.85em}.cc_div .cloud #c-bns{display:table-cell;min-width:170px;vertical-align:middle}#cm.cloud .c-bn{margin:.625em 0 0;width:100%}#cm.cloud .c-bn:first-child{margin:0}#cm.cloud.left{margin-right:1.25em}#cm.cloud.right{margin-left:1.25em}#cm.bar{border-radius:0;bottom:0;left:0;max-width:100%;padding:2em;position:fixed;right:0;width:100%}#cm.bar #c-inr{margin:0 auto;max-width:32em}#cm.bar #c-bns{max-width:33.75em}#cm.bar #cs{padding:0}.cc_div .bar #c-s-in{height:100%;max-height:100%;top:0;transform:none}.cc_div .bar #s-bl,.cc_div .bar #s-bns,.cc_div .bar #s-hdr{padding-left:1.6em;padding-right:1.6em}.cc_div .bar #cs{padding:0}.cc_div .bar #s-inr{border-radius:0;margin:0 0 0 auto;max-width:32em}.cc_div .bar.left #s-inr{margin-left:0;margin-right:auto}.cc_div .bar #s-bl table,.cc_div .bar #s-bl tbody,.cc_div .bar #s-bl td,.cc_div .bar #s-bl th,.cc_div .bar #s-bl thead,.cc_div .bar #s-bl tr,.cc_div .bar #s-cnt{display:block}.cc_div .bar #s-bl thead tr{left:-9999px;position:absolute;top:-9999px}.cc_div .bar #s-bl tr{border-top:1px solid #e3e7ed;border-color:var(--cc-cookie-table-border)}.cc_div .bar #s-bl td{border:none;padding-left:35%;position:relative}.cc_div .bar #s-bl td:before{color:#000;color:var(--cc-text);content:attr(data-column);left:1em;overflow:hidden;padding-right:.625em;position:absolute;text-overflow:ellipsis;white-space:nowrap}#cm.top{bottom:auto;top:1.25em}#cm.left{left:1.25em;right:auto}#cm.right{left:auto;right:1.25em}#cm.bar.left,#cm.bar.right{left:0;right:0}#cm.bar.top{top:0}@media screen and (max-width:688px){#cm,#cm.cloud,#cm.left,#cm.right{bottom:1em;display:block;left:1em;margin:0;max-width:100%;padding:1.4em!important;right:1em;width:auto}.force--consent #cm,.force--consent #cm.cloud{max-width:100vw;width:auto}#cm.top{bottom:auto;top:1em}#cm.bottom{bottom:1em;top:auto}#cm.bar.bottom{bottom:0}#cm.cloud .c-bn{font-size:.85em}#s-bns,.cc_div .bar #s-bns{padding:1em 1.3em}.cc_div .bar #s-inr{max-width:100%;width:100%}.cc_div .cloud #c-inr-i{padding-right:0}#cs{border-radius:0;padding:0}#c-s-in{height:100%;max-height:100%;top:0;transform:none}.cc_div .b-tg{right:1.1em;transform:scale(1.1)}#s-inr{border-radius:0;margin:0;padding-bottom:7.9em}#s-bns{height:7.9em}#s-bl,.cc_div .bar #s-bl{padding:1.3em}#s-hdr,.cc_div .bar #s-hdr{padding:0 1.3em}#s-bl table{width:100%}#s-inr.bns-t{padding-bottom:10.5em}.bns-t #s-bns{height:10.5em}.cc_div .bns-t .c-bn{font-size:.83em;padding:.9em 1.6em}#s-cnt .b-bn .b-tl{padding-bottom:1.2em;padding-top:1.2em}#s-bl table,#s-bl tbody,#s-bl td,#s-bl th,#s-bl thead,#s-bl tr,#s-cnt{display:block}#s-bl thead tr{left:-9999px;position:absolute;top:-9999px}#s-bl tr{border-top:1px solid #e3e7ed;border-color:var(--cc-cookie-table-border)}#s-bl td{border:none;padding-left:35%;position:relative}#s-bl td:before{color:#000;color:var(--cc-text);content:attr(data-column);left:1em;overflow:hidden;padding-right:.625em;position:absolute;text-overflow:ellipsis;white-space:nowrap}#cm .c-bn,.cc_div .c-bn{margin-right:0;width:100%}#s-cnt #s-rall-bn{margin-left:0}.cc_div #c-bns{flex-direction:column}#c-bns button+button,#s-cnt button+button{float:unset;margin-left:0;margin-top:.625em}#cm.box,#cm.cloud{left:1em;right:1em;width:auto}#cm.cloud.left,#cm.cloud.right{margin:0}.cc_div .cloud #c-bns,.cc_div .cloud #c-inr,.cc_div .cloud #c-inr-i{display:block;min-width:unset;width:auto}.cc_div .cloud #c-txt{font-size:.9em}.cc_div .cloud #c-bns{margin-top:1.625em}}.cc_div.ie #c-vln{height:100%;padding-top:5.62em}.cc_div.ie .bar #c-vln{padding-top:0}.cc_div.ie #cs{margin-top:-5.625em;max-height:37.5em;position:relative;top:0}.cc_div.ie .bar #cs{margin-top:0;max-height:100%}.cc_div.ie #cm{border:1px solid #dee6e9}.cc_div.ie #c-s-in{top:0}.cc_div.ie .b-tg{margin-bottom:.7em;padding-left:1em}.cc_div.ie .b-tg .c-tgl:checked~.c-tg:after{left:1.95em}.cc_div.ie #s-bl table{overflow:auto}.cc_div.ie .b-tg .c-tg{display:none}.cc_div.ie .b-tg .c-tgl{display:inline-block;height:auto;margin-bottom:.2em;position:relative;vertical-align:middle}.cc_div.ie #s-cnt .b-bn .b-tl{padding:1.3em 6.4em 1.3em 1.4em}.cc_div.ie .bar #s-bl td:before{display:none}.cc_div.ie .bar #s-bl td{padding:.8em .625em .8em 1.2em}.cc_div.ie .bar #s-bl thead tr{position:relative}.cc_div.ie .b-tg .t-lb{filter:alpha(opacity=0)}.cc_div.ie #cm-ov,.cc_div.ie #cs-ov{filter:alpha(opacity=80)}

#cc_div div::-webkit-scrollbar-track {
  background: inherit;
}
/*!
 * Font Awesome Free 5.13.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
.fa,
.fas,
.far,
.fal,
.fad,
.fab {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1; }

.fa-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -.0667em; }

.fa-xs {
  font-size: .75em; }

.fa-sm {
  font-size: .875em; }

.fa-1x {
  font-size: 1em; }

.fa-2x {
  font-size: 2em; }

.fa-3x {
  font-size: 3em; }

.fa-4x {
  font-size: 4em; }

.fa-5x {
  font-size: 5em; }

.fa-6x {
  font-size: 6em; }

.fa-7x {
  font-size: 7em; }

.fa-8x {
  font-size: 8em; }

.fa-9x {
  font-size: 9em; }

.fa-10x {
  font-size: 10em; }

.fa-fw {
  text-align: center;
  width: 1.25em; }

.fa-ul {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0; }
  .fa-ul > li {
    position: relative; }

.fa-li {
  left: -2em;
  position: absolute;
  text-align: center;
  width: 2em;
  line-height: inherit; }

.fa-border {
  border: solid 0.08em #eee;
  border-radius: .1em;
  padding: .2em .25em .15em; }

.fa-pull-left {
  float: left; }

.fa-pull-right {
  float: right; }

.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
  margin-right: .3em; }

.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
  margin-left: .3em; }

.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
          animation: fa-spin 2s infinite linear; }

.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
          animation: fa-spin 1s infinite steps(8); }

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1); }

.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
          transform: scale(1, -1); }

.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(-1, -1);
          transform: scale(-1, -1); }

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-flip-both {
  -webkit-filter: none;
          filter: none; }

.fa-stack {
  display: inline-block;
  height: 2em;
  line-height: 2em;
  position: relative;
  vertical-align: middle;
  width: 2.5em; }

.fa-stack-1x,
.fa-stack-2x {
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%; }

.fa-stack-1x {
  line-height: inherit; }

.fa-stack-2x {
  font-size: 2em; }

.fa-inverse {
  color: #fff; }

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.fa-500px:before {
  content: "\f26e"; }

.fa-accessible-icon:before {
  content: "\f368"; }

.fa-accusoft:before {
  content: "\f369"; }

.fa-acquisitions-incorporated:before {
  content: "\f6af"; }

.fa-ad:before {
  content: "\f641"; }

.fa-address-book:before {
  content: "\f2b9"; }

.fa-address-card:before {
  content: "\f2bb"; }

.fa-adjust:before {
  content: "\f042"; }

.fa-adn:before {
  content: "\f170"; }

.fa-adobe:before {
  content: "\f778"; }

.fa-adversal:before {
  content: "\f36a"; }

.fa-affiliatetheme:before {
  content: "\f36b"; }

.fa-air-freshener:before {
  content: "\f5d0"; }

.fa-airbnb:before {
  content: "\f834"; }

.fa-algolia:before {
  content: "\f36c"; }

.fa-align-center:before {
  content: "\f037"; }

.fa-align-justify:before {
  content: "\f039"; }

.fa-align-left:before {
  content: "\f036"; }

.fa-align-right:before {
  content: "\f038"; }

.fa-alipay:before {
  content: "\f642"; }

.fa-allergies:before {
  content: "\f461"; }

.fa-amazon:before {
  content: "\f270"; }

.fa-amazon-pay:before {
  content: "\f42c"; }

.fa-ambulance:before {
  content: "\f0f9"; }

.fa-american-sign-language-interpreting:before {
  content: "\f2a3"; }

.fa-amilia:before {
  content: "\f36d"; }

.fa-anchor:before {
  content: "\f13d"; }

.fa-android:before {
  content: "\f17b"; }

.fa-angellist:before {
  content: "\f209"; }

.fa-angle-double-down:before {
  content: "\f103"; }

.fa-angle-double-left:before {
  content: "\f100"; }

.fa-angle-double-right:before {
  content: "\f101"; }

.fa-angle-double-up:before {
  content: "\f102"; }

.fa-angle-down:before {
  content: "\f107"; }

.fa-angle-left:before {
  content: "\f104"; }

.fa-angle-right:before {
  content: "\f105"; }

.fa-angle-up:before {
  content: "\f106"; }

.fa-angry:before {
  content: "\f556"; }

.fa-angrycreative:before {
  content: "\f36e"; }

.fa-angular:before {
  content: "\f420"; }

.fa-ankh:before {
  content: "\f644"; }

.fa-app-store:before {
  content: "\f36f"; }

.fa-app-store-ios:before {
  content: "\f370"; }

.fa-apper:before {
  content: "\f371"; }

.fa-apple:before {
  content: "\f179"; }

.fa-apple-alt:before {
  content: "\f5d1"; }

.fa-apple-pay:before {
  content: "\f415"; }

.fa-archive:before {
  content: "\f187"; }

.fa-archway:before {
  content: "\f557"; }

.fa-arrow-alt-circle-down:before {
  content: "\f358"; }

.fa-arrow-alt-circle-left:before {
  content: "\f359"; }

.fa-arrow-alt-circle-right:before {
  content: "\f35a"; }

.fa-arrow-alt-circle-up:before {
  content: "\f35b"; }

.fa-arrow-circle-down:before {
  content: "\f0ab"; }

.fa-arrow-circle-left:before {
  content: "\f0a8"; }

.fa-arrow-circle-right:before {
  content: "\f0a9"; }

.fa-arrow-circle-up:before {
  content: "\f0aa"; }

.fa-arrow-down:before {
  content: "\f063"; }

.fa-arrow-left:before {
  content: "\f060"; }

.fa-arrow-right:before {
  content: "\f061"; }

.fa-arrow-up:before {
  content: "\f062"; }

.fa-arrows-alt:before {
  content: "\f0b2"; }

.fa-arrows-alt-h:before {
  content: "\f337"; }

.fa-arrows-alt-v:before {
  content: "\f338"; }

.fa-artstation:before {
  content: "\f77a"; }

.fa-assistive-listening-systems:before {
  content: "\f2a2"; }

.fa-asterisk:before {
  content: "\f069"; }

.fa-asymmetrik:before {
  content: "\f372"; }

.fa-at:before {
  content: "\f1fa"; }

.fa-atlas:before {
  content: "\f558"; }

.fa-atlassian:before {
  content: "\f77b"; }

.fa-atom:before {
  content: "\f5d2"; }

.fa-audible:before {
  content: "\f373"; }

.fa-audio-description:before {
  content: "\f29e"; }

.fa-autoprefixer:before {
  content: "\f41c"; }

.fa-avianex:before {
  content: "\f374"; }

.fa-aviato:before {
  content: "\f421"; }

.fa-award:before {
  content: "\f559"; }

.fa-aws:before {
  content: "\f375"; }

.fa-baby:before {
  content: "\f77c"; }

.fa-baby-carriage:before {
  content: "\f77d"; }

.fa-backspace:before {
  content: "\f55a"; }

.fa-backward:before {
  content: "\f04a"; }

.fa-bacon:before {
  content: "\f7e5"; }

.fa-bahai:before {
  content: "\f666"; }

.fa-balance-scale:before {
  content: "\f24e"; }

.fa-balance-scale-left:before {
  content: "\f515"; }

.fa-balance-scale-right:before {
  content: "\f516"; }

.fa-ban:before {
  content: "\f05e"; }

.fa-band-aid:before {
  content: "\f462"; }

.fa-bandcamp:before {
  content: "\f2d5"; }

.fa-barcode:before {
  content: "\f02a"; }

.fa-bars:before {
  content: "\f0c9"; }

.fa-baseball-ball:before {
  content: "\f433"; }

.fa-basketball-ball:before {
  content: "\f434"; }

.fa-bath:before {
  content: "\f2cd"; }

.fa-battery-empty:before {
  content: "\f244"; }

.fa-battery-full:before {
  content: "\f240"; }

.fa-battery-half:before {
  content: "\f242"; }

.fa-battery-quarter:before {
  content: "\f243"; }

.fa-battery-three-quarters:before {
  content: "\f241"; }

.fa-battle-net:before {
  content: "\f835"; }

.fa-bed:before {
  content: "\f236"; }

.fa-beer:before {
  content: "\f0fc"; }

.fa-behance:before {
  content: "\f1b4"; }

.fa-behance-square:before {
  content: "\f1b5"; }

.fa-bell:before {
  content: "\f0f3"; }

.fa-bell-slash:before {
  content: "\f1f6"; }

.fa-bezier-curve:before {
  content: "\f55b"; }

.fa-bible:before {
  content: "\f647"; }

.fa-bicycle:before {
  content: "\f206"; }

.fa-biking:before {
  content: "\f84a"; }

.fa-bimobject:before {
  content: "\f378"; }

.fa-binoculars:before {
  content: "\f1e5"; }

.fa-biohazard:before {
  content: "\f780"; }

.fa-birthday-cake:before {
  content: "\f1fd"; }

.fa-bitbucket:before {
  content: "\f171"; }

.fa-bitcoin:before {
  content: "\f379"; }

.fa-bity:before {
  content: "\f37a"; }

.fa-black-tie:before {
  content: "\f27e"; }

.fa-blackberry:before {
  content: "\f37b"; }

.fa-blender:before {
  content: "\f517"; }

.fa-blender-phone:before {
  content: "\f6b6"; }

.fa-blind:before {
  content: "\f29d"; }

.fa-blog:before {
  content: "\f781"; }

.fa-blogger:before {
  content: "\f37c"; }

.fa-blogger-b:before {
  content: "\f37d"; }

.fa-bluetooth:before {
  content: "\f293"; }

.fa-bluetooth-b:before {
  content: "\f294"; }

.fa-bold:before {
  content: "\f032"; }

.fa-bolt:before {
  content: "\f0e7"; }

.fa-bomb:before {
  content: "\f1e2"; }

.fa-bone:before {
  content: "\f5d7"; }

.fa-bong:before {
  content: "\f55c"; }

.fa-book:before {
  content: "\f02d"; }

.fa-book-dead:before {
  content: "\f6b7"; }

.fa-book-medical:before {
  content: "\f7e6"; }

.fa-book-open:before {
  content: "\f518"; }

.fa-book-reader:before {
  content: "\f5da"; }

.fa-bookmark:before {
  content: "\f02e"; }

.fa-bootstrap:before {
  content: "\f836"; }

.fa-border-all:before {
  content: "\f84c"; }

.fa-border-none:before {
  content: "\f850"; }

.fa-border-style:before {
  content: "\f853"; }

.fa-bowling-ball:before {
  content: "\f436"; }

.fa-box:before {
  content: "\f466"; }

.fa-box-open:before {
  content: "\f49e"; }

.fa-box-tissue:before {
  content: "\f95b"; }

.fa-boxes:before {
  content: "\f468"; }

.fa-braille:before {
  content: "\f2a1"; }

.fa-brain:before {
  content: "\f5dc"; }

.fa-bread-slice:before {
  content: "\f7ec"; }

.fa-briefcase:before {
  content: "\f0b1"; }

.fa-briefcase-medical:before {
  content: "\f469"; }

.fa-broadcast-tower:before {
  content: "\f519"; }

.fa-broom:before {
  content: "\f51a"; }

.fa-brush:before {
  content: "\f55d"; }

.fa-btc:before {
  content: "\f15a"; }

.fa-buffer:before {
  content: "\f837"; }

.fa-bug:before {
  content: "\f188"; }

.fa-building:before {
  content: "\f1ad"; }

.fa-bullhorn:before {
  content: "\f0a1"; }

.fa-bullseye:before {
  content: "\f140"; }

.fa-burn:before {
  content: "\f46a"; }

.fa-buromobelexperte:before {
  content: "\f37f"; }

.fa-bus:before {
  content: "\f207"; }

.fa-bus-alt:before {
  content: "\f55e"; }

.fa-business-time:before {
  content: "\f64a"; }

.fa-buy-n-large:before {
  content: "\f8a6"; }

.fa-buysellads:before {
  content: "\f20d"; }

.fa-calculator:before {
  content: "\f1ec"; }

.fa-calendar:before {
  content: "\f133"; }

.fa-calendar-alt:before {
  content: "\f073"; }

.fa-calendar-check:before {
  content: "\f274"; }

.fa-calendar-day:before {
  content: "\f783"; }

.fa-calendar-minus:before {
  content: "\f272"; }

.fa-calendar-plus:before {
  content: "\f271"; }

.fa-calendar-times:before {
  content: "\f273"; }

.fa-calendar-week:before {
  content: "\f784"; }

.fa-camera:before {
  content: "\f030"; }

.fa-camera-retro:before {
  content: "\f083"; }

.fa-campground:before {
  content: "\f6bb"; }

.fa-canadian-maple-leaf:before {
  content: "\f785"; }

.fa-candy-cane:before {
  content: "\f786"; }

.fa-cannabis:before {
  content: "\f55f"; }

.fa-capsules:before {
  content: "\f46b"; }

.fa-car:before {
  content: "\f1b9"; }

.fa-car-alt:before {
  content: "\f5de"; }

.fa-car-battery:before {
  content: "\f5df"; }

.fa-car-crash:before {
  content: "\f5e1"; }

.fa-car-side:before {
  content: "\f5e4"; }

.fa-caravan:before {
  content: "\f8ff"; }

.fa-caret-down:before {
  content: "\f0d7"; }

.fa-caret-left:before {
  content: "\f0d9"; }

.fa-caret-right:before {
  content: "\f0da"; }

.fa-caret-square-down:before {
  content: "\f150"; }

.fa-caret-square-left:before {
  content: "\f191"; }

.fa-caret-square-right:before {
  content: "\f152"; }

.fa-caret-square-up:before {
  content: "\f151"; }

.fa-caret-up:before {
  content: "\f0d8"; }

.fa-carrot:before {
  content: "\f787"; }

.fa-cart-arrow-down:before {
  content: "\f218"; }

.fa-cart-plus:before {
  content: "\f217"; }

.fa-cash-register:before {
  content: "\f788"; }

.fa-cat:before {
  content: "\f6be"; }

.fa-cc-amazon-pay:before {
  content: "\f42d"; }

.fa-cc-amex:before {
  content: "\f1f3"; }

.fa-cc-apple-pay:before {
  content: "\f416"; }

.fa-cc-diners-club:before {
  content: "\f24c"; }

.fa-cc-discover:before {
  content: "\f1f2"; }

.fa-cc-jcb:before {
  content: "\f24b"; }

.fa-cc-mastercard:before {
  content: "\f1f1"; }

.fa-cc-paypal:before {
  content: "\f1f4"; }

.fa-cc-stripe:before {
  content: "\f1f5"; }

.fa-cc-visa:before {
  content: "\f1f0"; }

.fa-centercode:before {
  content: "\f380"; }

.fa-centos:before {
  content: "\f789"; }

.fa-certificate:before {
  content: "\f0a3"; }

.fa-chair:before {
  content: "\f6c0"; }

.fa-chalkboard:before {
  content: "\f51b"; }

.fa-chalkboard-teacher:before {
  content: "\f51c"; }

.fa-charging-station:before {
  content: "\f5e7"; }

.fa-chart-area:before {
  content: "\f1fe"; }

.fa-chart-bar:before {
  content: "\f080"; }

.fa-chart-line:before {
  content: "\f201"; }

.fa-chart-pie:before {
  content: "\f200"; }

.fa-check:before {
  content: "\f00c"; }

.fa-check-circle:before {
  content: "\f058"; }

.fa-check-double:before {
  content: "\f560"; }

.fa-check-square:before {
  content: "\f14a"; }

.fa-cheese:before {
  content: "\f7ef"; }

.fa-chess:before {
  content: "\f439"; }

.fa-chess-bishop:before {
  content: "\f43a"; }

.fa-chess-board:before {
  content: "\f43c"; }

.fa-chess-king:before {
  content: "\f43f"; }

.fa-chess-knight:before {
  content: "\f441"; }

.fa-chess-pawn:before {
  content: "\f443"; }

.fa-chess-queen:before {
  content: "\f445"; }

.fa-chess-rook:before {
  content: "\f447"; }

.fa-chevron-circle-down:before {
  content: "\f13a"; }

.fa-chevron-circle-left:before {
  content: "\f137"; }

.fa-chevron-circle-right:before {
  content: "\f138"; }

.fa-chevron-circle-up:before {
  content: "\f139"; }

.fa-chevron-down:before {
  content: "\f078"; }

.fa-chevron-left:before {
  content: "\f053"; }

.fa-chevron-right:before {
  content: "\f054"; }

.fa-chevron-up:before {
  content: "\f077"; }

.fa-child:before {
  content: "\f1ae"; }

.fa-chrome:before {
  content: "\f268"; }

.fa-chromecast:before {
  content: "\f838"; }

.fa-church:before {
  content: "\f51d"; }

.fa-circle:before {
  content: "\f111"; }

.fa-circle-notch:before {
  content: "\f1ce"; }

.fa-city:before {
  content: "\f64f"; }

.fa-clinic-medical:before {
  content: "\f7f2"; }

.fa-clipboard:before {
  content: "\f328"; }

.fa-clipboard-check:before {
  content: "\f46c"; }

.fa-clipboard-list:before {
  content: "\f46d"; }

.fa-clock:before {
  content: "\f017"; }

.fa-clone:before {
  content: "\f24d"; }

.fa-closed-captioning:before {
  content: "\f20a"; }

.fa-cloud:before {
  content: "\f0c2"; }

.fa-cloud-download-alt:before {
  content: "\f381"; }

.fa-cloud-meatball:before {
  content: "\f73b"; }

.fa-cloud-moon:before {
  content: "\f6c3"; }

.fa-cloud-moon-rain:before {
  content: "\f73c"; }

.fa-cloud-rain:before {
  content: "\f73d"; }

.fa-cloud-showers-heavy:before {
  content: "\f740"; }

.fa-cloud-sun:before {
  content: "\f6c4"; }

.fa-cloud-sun-rain:before {
  content: "\f743"; }

.fa-cloud-upload-alt:before {
  content: "\f382"; }

.fa-cloudscale:before {
  content: "\f383"; }

.fa-cloudsmith:before {
  content: "\f384"; }

.fa-cloudversify:before {
  content: "\f385"; }

.fa-cocktail:before {
  content: "\f561"; }

.fa-code:before {
  content: "\f121"; }

.fa-code-branch:before {
  content: "\f126"; }

.fa-codepen:before {
  content: "\f1cb"; }

.fa-codiepie:before {
  content: "\f284"; }

.fa-coffee:before {
  content: "\f0f4"; }

.fa-cog:before {
  content: "\f013"; }

.fa-cogs:before {
  content: "\f085"; }

.fa-coins:before {
  content: "\f51e"; }

.fa-columns:before {
  content: "\f0db"; }

.fa-comment:before {
  content: "\f075"; }

.fa-comment-alt:before {
  content: "\f27a"; }

.fa-comment-dollar:before {
  content: "\f651"; }

.fa-comment-dots:before {
  content: "\f4ad"; }

.fa-comment-medical:before {
  content: "\f7f5"; }

.fa-comment-slash:before {
  content: "\f4b3"; }

.fa-comments:before {
  content: "\f086"; }

.fa-comments-dollar:before {
  content: "\f653"; }

.fa-compact-disc:before {
  content: "\f51f"; }

.fa-compass:before {
  content: "\f14e"; }

.fa-compress:before {
  content: "\f066"; }

.fa-compress-alt:before {
  content: "\f422"; }

.fa-compress-arrows-alt:before {
  content: "\f78c"; }

.fa-concierge-bell:before {
  content: "\f562"; }

.fa-confluence:before {
  content: "\f78d"; }

.fa-connectdevelop:before {
  content: "\f20e"; }

.fa-contao:before {
  content: "\f26d"; }

.fa-cookie:before {
  content: "\f563"; }

.fa-cookie-bite:before {
  content: "\f564"; }

.fa-copy:before {
  content: "\f0c5"; }

.fa-copyright:before {
  content: "\f1f9"; }

.fa-cotton-bureau:before {
  content: "\f89e"; }

.fa-couch:before {
  content: "\f4b8"; }

.fa-cpanel:before {
  content: "\f388"; }

.fa-creative-commons:before {
  content: "\f25e"; }

.fa-creative-commons-by:before {
  content: "\f4e7"; }

.fa-creative-commons-nc:before {
  content: "\f4e8"; }

.fa-creative-commons-nc-eu:before {
  content: "\f4e9"; }

.fa-creative-commons-nc-jp:before {
  content: "\f4ea"; }

.fa-creative-commons-nd:before {
  content: "\f4eb"; }

.fa-creative-commons-pd:before {
  content: "\f4ec"; }

.fa-creative-commons-pd-alt:before {
  content: "\f4ed"; }

.fa-creative-commons-remix:before {
  content: "\f4ee"; }

.fa-creative-commons-sa:before {
  content: "\f4ef"; }

.fa-creative-commons-sampling:before {
  content: "\f4f0"; }

.fa-creative-commons-sampling-plus:before {
  content: "\f4f1"; }

.fa-creative-commons-share:before {
  content: "\f4f2"; }

.fa-creative-commons-zero:before {
  content: "\f4f3"; }

.fa-credit-card:before {
  content: "\f09d"; }

.fa-critical-role:before {
  content: "\f6c9"; }

.fa-crop:before {
  content: "\f125"; }

.fa-crop-alt:before {
  content: "\f565"; }

.fa-cross:before {
  content: "\f654"; }

.fa-crosshairs:before {
  content: "\f05b"; }

.fa-crow:before {
  content: "\f520"; }

.fa-crown:before {
  content: "\f521"; }

.fa-crutch:before {
  content: "\f7f7"; }

.fa-css3:before {
  content: "\f13c"; }

.fa-css3-alt:before {
  content: "\f38b"; }

.fa-cube:before {
  content: "\f1b2"; }

.fa-cubes:before {
  content: "\f1b3"; }

.fa-cut:before {
  content: "\f0c4"; }

.fa-cuttlefish:before {
  content: "\f38c"; }

.fa-d-and-d:before {
  content: "\f38d"; }

.fa-d-and-d-beyond:before {
  content: "\f6ca"; }

.fa-dailymotion:before {
  content: "\f952"; }

.fa-dashcube:before {
  content: "\f210"; }

.fa-database:before {
  content: "\f1c0"; }

.fa-deaf:before {
  content: "\f2a4"; }

.fa-delicious:before {
  content: "\f1a5"; }

.fa-democrat:before {
  content: "\f747"; }

.fa-deploydog:before {
  content: "\f38e"; }

.fa-deskpro:before {
  content: "\f38f"; }

.fa-desktop:before {
  content: "\f108"; }

.fa-dev:before {
  content: "\f6cc"; }

.fa-deviantart:before {
  content: "\f1bd"; }

.fa-dharmachakra:before {
  content: "\f655"; }

.fa-dhl:before {
  content: "\f790"; }

.fa-diagnoses:before {
  content: "\f470"; }

.fa-diaspora:before {
  content: "\f791"; }

.fa-dice:before {
  content: "\f522"; }

.fa-dice-d20:before {
  content: "\f6cf"; }

.fa-dice-d6:before {
  content: "\f6d1"; }

.fa-dice-five:before {
  content: "\f523"; }

.fa-dice-four:before {
  content: "\f524"; }

.fa-dice-one:before {
  content: "\f525"; }

.fa-dice-six:before {
  content: "\f526"; }

.fa-dice-three:before {
  content: "\f527"; }

.fa-dice-two:before {
  content: "\f528"; }

.fa-digg:before {
  content: "\f1a6"; }

.fa-digital-ocean:before {
  content: "\f391"; }

.fa-digital-tachograph:before {
  content: "\f566"; }

.fa-directions:before {
  content: "\f5eb"; }

.fa-discord:before {
  content: "\f392"; }

.fa-discourse:before {
  content: "\f393"; }

.fa-disease:before {
  content: "\f7fa"; }

.fa-divide:before {
  content: "\f529"; }

.fa-dizzy:before {
  content: "\f567"; }

.fa-dna:before {
  content: "\f471"; }

.fa-dochub:before {
  content: "\f394"; }

.fa-docker:before {
  content: "\f395"; }

.fa-dog:before {
  content: "\f6d3"; }

.fa-dollar-sign:before {
  content: "\f155"; }

.fa-dolly:before {
  content: "\f472"; }

.fa-dolly-flatbed:before {
  content: "\f474"; }

.fa-donate:before {
  content: "\f4b9"; }

.fa-door-closed:before {
  content: "\f52a"; }

.fa-door-open:before {
  content: "\f52b"; }

.fa-dot-circle:before {
  content: "\f192"; }

.fa-dove:before {
  content: "\f4ba"; }

.fa-download:before {
  content: "\f019"; }

.fa-draft2digital:before {
  content: "\f396"; }

.fa-drafting-compass:before {
  content: "\f568"; }

.fa-dragon:before {
  content: "\f6d5"; }

.fa-draw-polygon:before {
  content: "\f5ee"; }

.fa-dribbble:before {
  content: "\f17d"; }

.fa-dribbble-square:before {
  content: "\f397"; }

.fa-dropbox:before {
  content: "\f16b"; }

.fa-drum:before {
  content: "\f569"; }

.fa-drum-steelpan:before {
  content: "\f56a"; }

.fa-drumstick-bite:before {
  content: "\f6d7"; }

.fa-drupal:before {
  content: "\f1a9"; }

.fa-dumbbell:before {
  content: "\f44b"; }

.fa-dumpster:before {
  content: "\f793"; }

.fa-dumpster-fire:before {
  content: "\f794"; }

.fa-dungeon:before {
  content: "\f6d9"; }

.fa-dyalog:before {
  content: "\f399"; }

.fa-earlybirds:before {
  content: "\f39a"; }

.fa-ebay:before {
  content: "\f4f4"; }

.fa-edge:before {
  content: "\f282"; }

.fa-edit:before {
  content: "\f044"; }

.fa-egg:before {
  content: "\f7fb"; }

.fa-eject:before {
  content: "\f052"; }

.fa-elementor:before {
  content: "\f430"; }

.fa-ellipsis-h:before {
  content: "\f141"; }

.fa-ellipsis-v:before {
  content: "\f142"; }

.fa-ello:before {
  content: "\f5f1"; }

.fa-ember:before {
  content: "\f423"; }

.fa-empire:before {
  content: "\f1d1"; }

.fa-envelope:before {
  content: "\f0e0"; }

.fa-envelope-open:before {
  content: "\f2b6"; }

.fa-envelope-open-text:before {
  content: "\f658"; }

.fa-envelope-square:before {
  content: "\f199"; }

.fa-envira:before {
  content: "\f299"; }

.fa-equals:before {
  content: "\f52c"; }

.fa-eraser:before {
  content: "\f12d"; }

.fa-erlang:before {
  content: "\f39d"; }

.fa-ethereum:before {
  content: "\f42e"; }

.fa-ethernet:before {
  content: "\f796"; }

.fa-etsy:before {
  content: "\f2d7"; }

.fa-euro-sign:before {
  content: "\f153"; }

.fa-evernote:before {
  content: "\f839"; }

.fa-exchange-alt:before {
  content: "\f362"; }

.fa-exclamation:before {
  content: "\f12a"; }

.fa-exclamation-circle:before {
  content: "\f06a"; }

.fa-exclamation-triangle:before {
  content: "\f071"; }

.fa-expand:before {
  content: "\f065"; }

.fa-expand-alt:before {
  content: "\f424"; }

.fa-expand-arrows-alt:before {
  content: "\f31e"; }

.fa-expeditedssl:before {
  content: "\f23e"; }

.fa-external-link-alt:before {
  content: "\f35d"; }

.fa-external-link-square-alt:before {
  content: "\f360"; }

.fa-eye:before {
  content: "\f06e"; }

.fa-eye-dropper:before {
  content: "\f1fb"; }

.fa-eye-slash:before {
  content: "\f070"; }

.fa-facebook:before {
  content: "\f09a"; }

.fa-facebook-f:before {
  content: "\f39e"; }

.fa-facebook-messenger:before {
  content: "\f39f"; }

.fa-facebook-square:before {
  content: "\f082"; }

.fa-fan:before {
  content: "\f863"; }

.fa-fantasy-flight-games:before {
  content: "\f6dc"; }

.fa-fast-backward:before {
  content: "\f049"; }

.fa-fast-forward:before {
  content: "\f050"; }

.fa-faucet:before {
  content: "\f905"; }

.fa-fax:before {
  content: "\f1ac"; }

.fa-feather:before {
  content: "\f52d"; }

.fa-feather-alt:before {
  content: "\f56b"; }

.fa-fedex:before {
  content: "\f797"; }

.fa-fedora:before {
  content: "\f798"; }

.fa-female:before {
  content: "\f182"; }

.fa-fighter-jet:before {
  content: "\f0fb"; }

.fa-figma:before {
  content: "\f799"; }

.fa-file:before {
  content: "\f15b"; }

.fa-file-alt:before {
  content: "\f15c"; }

.fa-file-archive:before {
  content: "\f1c6"; }

.fa-file-audio:before {
  content: "\f1c7"; }

.fa-file-code:before {
  content: "\f1c9"; }

.fa-file-contract:before {
  content: "\f56c"; }

.fa-file-csv:before {
  content: "\f6dd"; }

.fa-file-download:before {
  content: "\f56d"; }

.fa-file-excel:before {
  content: "\f1c3"; }

.fa-file-export:before {
  content: "\f56e"; }

.fa-file-image:before {
  content: "\f1c5"; }

.fa-file-import:before {
  content: "\f56f"; }

.fa-file-invoice:before {
  content: "\f570"; }

.fa-file-invoice-dollar:before {
  content: "\f571"; }

.fa-file-medical:before {
  content: "\f477"; }

.fa-file-medical-alt:before {
  content: "\f478"; }

.fa-file-pdf:before {
  content: "\f1c1"; }

.fa-file-powerpoint:before {
  content: "\f1c4"; }

.fa-file-prescription:before {
  content: "\f572"; }

.fa-file-signature:before {
  content: "\f573"; }

.fa-file-upload:before {
  content: "\f574"; }

.fa-file-video:before {
  content: "\f1c8"; }

.fa-file-word:before {
  content: "\f1c2"; }

.fa-fill:before {
  content: "\f575"; }

.fa-fill-drip:before {
  content: "\f576"; }

.fa-film:before {
  content: "\f008"; }

.fa-filter:before {
  content: "\f0b0"; }

.fa-fingerprint:before {
  content: "\f577"; }

.fa-fire:before {
  content: "\f06d"; }

.fa-fire-alt:before {
  content: "\f7e4"; }

.fa-fire-extinguisher:before {
  content: "\f134"; }

.fa-firefox:before {
  content: "\f269"; }

.fa-firefox-browser:before {
  content: "\f907"; }

.fa-first-aid:before {
  content: "\f479"; }

.fa-first-order:before {
  content: "\f2b0"; }

.fa-first-order-alt:before {
  content: "\f50a"; }

.fa-firstdraft:before {
  content: "\f3a1"; }

.fa-fish:before {
  content: "\f578"; }

.fa-fist-raised:before {
  content: "\f6de"; }

.fa-flag:before {
  content: "\f024"; }

.fa-flag-checkered:before {
  content: "\f11e"; }

.fa-flag-usa:before {
  content: "\f74d"; }

.fa-flask:before {
  content: "\f0c3"; }

.fa-flickr:before {
  content: "\f16e"; }

.fa-flipboard:before {
  content: "\f44d"; }

.fa-flushed:before {
  content: "\f579"; }

.fa-fly:before {
  content: "\f417"; }

.fa-folder:before {
  content: "\f07b"; }

.fa-folder-minus:before {
  content: "\f65d"; }

.fa-folder-open:before {
  content: "\f07c"; }

.fa-folder-plus:before {
  content: "\f65e"; }

.fa-font:before {
  content: "\f031"; }

.fa-font-awesome:before {
  content: "\f2b4"; }

.fa-font-awesome-alt:before {
  content: "\f35c"; }

.fa-font-awesome-flag:before {
  content: "\f425"; }

.fa-font-awesome-logo-full:before {
  content: "\f4e6"; }

.fa-fonticons:before {
  content: "\f280"; }

.fa-fonticons-fi:before {
  content: "\f3a2"; }

.fa-football-ball:before {
  content: "\f44e"; }

.fa-fort-awesome:before {
  content: "\f286"; }

.fa-fort-awesome-alt:before {
  content: "\f3a3"; }

.fa-forumbee:before {
  content: "\f211"; }

.fa-forward:before {
  content: "\f04e"; }

.fa-foursquare:before {
  content: "\f180"; }

.fa-free-code-camp:before {
  content: "\f2c5"; }

.fa-freebsd:before {
  content: "\f3a4"; }

.fa-frog:before {
  content: "\f52e"; }

.fa-frown:before {
  content: "\f119"; }

.fa-frown-open:before {
  content: "\f57a"; }

.fa-fulcrum:before {
  content: "\f50b"; }

.fa-funnel-dollar:before {
  content: "\f662"; }

.fa-futbol:before {
  content: "\f1e3"; }

.fa-galactic-republic:before {
  content: "\f50c"; }

.fa-galactic-senate:before {
  content: "\f50d"; }

.fa-gamepad:before {
  content: "\f11b"; }

.fa-gas-pump:before {
  content: "\f52f"; }

.fa-gavel:before {
  content: "\f0e3"; }

.fa-gem:before {
  content: "\f3a5"; }

.fa-genderless:before {
  content: "\f22d"; }

.fa-get-pocket:before {
  content: "\f265"; }

.fa-gg:before {
  content: "\f260"; }

.fa-gg-circle:before {
  content: "\f261"; }

.fa-ghost:before {
  content: "\f6e2"; }

.fa-gift:before {
  content: "\f06b"; }

.fa-gifts:before {
  content: "\f79c"; }

.fa-git:before {
  content: "\f1d3"; }

.fa-git-alt:before {
  content: "\f841"; }

.fa-git-square:before {
  content: "\f1d2"; }

.fa-github:before {
  content: "\f09b"; }

.fa-github-alt:before {
  content: "\f113"; }

.fa-github-square:before {
  content: "\f092"; }

.fa-gitkraken:before {
  content: "\f3a6"; }

.fa-gitlab:before {
  content: "\f296"; }

.fa-gitter:before {
  content: "\f426"; }

.fa-glass-cheers:before {
  content: "\f79f"; }

.fa-glass-martini:before {
  content: "\f000"; }

.fa-glass-martini-alt:before {
  content: "\f57b"; }

.fa-glass-whiskey:before {
  content: "\f7a0"; }

.fa-glasses:before {
  content: "\f530"; }

.fa-glide:before {
  content: "\f2a5"; }

.fa-glide-g:before {
  content: "\f2a6"; }

.fa-globe:before {
  content: "\f0ac"; }

.fa-globe-africa:before {
  content: "\f57c"; }

.fa-globe-americas:before {
  content: "\f57d"; }

.fa-globe-asia:before {
  content: "\f57e"; }

.fa-globe-europe:before {
  content: "\f7a2"; }

.fa-gofore:before {
  content: "\f3a7"; }

.fa-golf-ball:before {
  content: "\f450"; }

.fa-goodreads:before {
  content: "\f3a8"; }

.fa-goodreads-g:before {
  content: "\f3a9"; }

.fa-google:before {
  content: "\f1a0"; }

.fa-google-drive:before {
  content: "\f3aa"; }

.fa-google-play:before {
  content: "\f3ab"; }

.fa-google-plus:before {
  content: "\f2b3"; }

.fa-google-plus-g:before {
  content: "\f0d5"; }

.fa-google-plus-square:before {
  content: "\f0d4"; }

.fa-google-wallet:before {
  content: "\f1ee"; }

.fa-gopuram:before {
  content: "\f664"; }

.fa-graduation-cap:before {
  content: "\f19d"; }

.fa-gratipay:before {
  content: "\f184"; }

.fa-grav:before {
  content: "\f2d6"; }

.fa-greater-than:before {
  content: "\f531"; }

.fa-greater-than-equal:before {
  content: "\f532"; }

.fa-grimace:before {
  content: "\f57f"; }

.fa-grin:before {
  content: "\f580"; }

.fa-grin-alt:before {
  content: "\f581"; }

.fa-grin-beam:before {
  content: "\f582"; }

.fa-grin-beam-sweat:before {
  content: "\f583"; }

.fa-grin-hearts:before {
  content: "\f584"; }

.fa-grin-squint:before {
  content: "\f585"; }

.fa-grin-squint-tears:before {
  content: "\f586"; }

.fa-grin-stars:before {
  content: "\f587"; }

.fa-grin-tears:before {
  content: "\f588"; }

.fa-grin-tongue:before {
  content: "\f589"; }

.fa-grin-tongue-squint:before {
  content: "\f58a"; }

.fa-grin-tongue-wink:before {
  content: "\f58b"; }

.fa-grin-wink:before {
  content: "\f58c"; }

.fa-grip-horizontal:before {
  content: "\f58d"; }

.fa-grip-lines:before {
  content: "\f7a4"; }

.fa-grip-lines-vertical:before {
  content: "\f7a5"; }

.fa-grip-vertical:before {
  content: "\f58e"; }

.fa-gripfire:before {
  content: "\f3ac"; }

.fa-grunt:before {
  content: "\f3ad"; }

.fa-guitar:before {
  content: "\f7a6"; }

.fa-gulp:before {
  content: "\f3ae"; }

.fa-h-square:before {
  content: "\f0fd"; }

.fa-hacker-news:before {
  content: "\f1d4"; }

.fa-hacker-news-square:before {
  content: "\f3af"; }

.fa-hackerrank:before {
  content: "\f5f7"; }

.fa-hamburger:before {
  content: "\f805"; }

.fa-hammer:before {
  content: "\f6e3"; }

.fa-hamsa:before {
  content: "\f665"; }

.fa-hand-holding:before {
  content: "\f4bd"; }

.fa-hand-holding-heart:before {
  content: "\f4be"; }

.fa-hand-holding-medical:before {
  content: "\f95c"; }

.fa-hand-holding-usd:before {
  content: "\f4c0"; }

.fa-hand-holding-water:before {
  content: "\f4c1"; }

.fa-hand-lizard:before {
  content: "\f258"; }

.fa-hand-middle-finger:before {
  content: "\f806"; }

.fa-hand-paper:before {
  content: "\f256"; }

.fa-hand-peace:before {
  content: "\f25b"; }

.fa-hand-point-down:before {
  content: "\f0a7"; }

.fa-hand-point-left:before {
  content: "\f0a5"; }

.fa-hand-point-right:before {
  content: "\f0a4"; }

.fa-hand-point-up:before {
  content: "\f0a6"; }

.fa-hand-pointer:before {
  content: "\f25a"; }

.fa-hand-rock:before {
  content: "\f255"; }

.fa-hand-scissors:before {
  content: "\f257"; }

.fa-hand-sparkles:before {
  content: "\f95d"; }

.fa-hand-spock:before {
  content: "\f259"; }

.fa-hands:before {
  content: "\f4c2"; }

.fa-hands-helping:before {
  content: "\f4c4"; }

.fa-hands-wash:before {
  content: "\f95e"; }

.fa-handshake:before {
  content: "\f2b5"; }

.fa-handshake-alt-slash:before {
  content: "\f95f"; }

.fa-handshake-slash:before {
  content: "\f960"; }

.fa-hanukiah:before {
  content: "\f6e6"; }

.fa-hard-hat:before {
  content: "\f807"; }

.fa-hashtag:before {
  content: "\f292"; }

.fa-hat-cowboy:before {
  content: "\f8c0"; }

.fa-hat-cowboy-side:before {
  content: "\f8c1"; }

.fa-hat-wizard:before {
  content: "\f6e8"; }

.fa-hdd:before {
  content: "\f0a0"; }

.fa-head-side-cough:before {
  content: "\f961"; }

.fa-head-side-cough-slash:before {
  content: "\f962"; }

.fa-head-side-mask:before {
  content: "\f963"; }

.fa-head-side-virus:before {
  content: "\f964"; }

.fa-heading:before {
  content: "\f1dc"; }

.fa-headphones:before {
  content: "\f025"; }

.fa-headphones-alt:before {
  content: "\f58f"; }

.fa-headset:before {
  content: "\f590"; }

.fa-heart:before {
  content: "\f004"; }

.fa-heart-broken:before {
  content: "\f7a9"; }

.fa-heartbeat:before {
  content: "\f21e"; }

.fa-helicopter:before {
  content: "\f533"; }

.fa-highlighter:before {
  content: "\f591"; }

.fa-hiking:before {
  content: "\f6ec"; }

.fa-hippo:before {
  content: "\f6ed"; }

.fa-hips:before {
  content: "\f452"; }

.fa-hire-a-helper:before {
  content: "\f3b0"; }

.fa-history:before {
  content: "\f1da"; }

.fa-hockey-puck:before {
  content: "\f453"; }

.fa-holly-berry:before {
  content: "\f7aa"; }

.fa-home:before {
  content: "\f015"; }

.fa-hooli:before {
  content: "\f427"; }

.fa-hornbill:before {
  content: "\f592"; }

.fa-horse:before {
  content: "\f6f0"; }

.fa-horse-head:before {
  content: "\f7ab"; }

.fa-hospital:before {
  content: "\f0f8"; }

.fa-hospital-alt:before {
  content: "\f47d"; }

.fa-hospital-symbol:before {
  content: "\f47e"; }

.fa-hospital-user:before {
  content: "\f80d"; }

.fa-hot-tub:before {
  content: "\f593"; }

.fa-hotdog:before {
  content: "\f80f"; }

.fa-hotel:before {
  content: "\f594"; }

.fa-hotjar:before {
  content: "\f3b1"; }

.fa-hourglass:before {
  content: "\f254"; }

.fa-hourglass-end:before {
  content: "\f253"; }

.fa-hourglass-half:before {
  content: "\f252"; }

.fa-hourglass-start:before {
  content: "\f251"; }

.fa-house-damage:before {
  content: "\f6f1"; }

.fa-house-user:before {
  content: "\f965"; }

.fa-houzz:before {
  content: "\f27c"; }

.fa-hryvnia:before {
  content: "\f6f2"; }

.fa-html5:before {
  content: "\f13b"; }

.fa-hubspot:before {
  content: "\f3b2"; }

.fa-i-cursor:before {
  content: "\f246"; }

.fa-ice-cream:before {
  content: "\f810"; }

.fa-icicles:before {
  content: "\f7ad"; }

.fa-icons:before {
  content: "\f86d"; }

.fa-id-badge:before {
  content: "\f2c1"; }

.fa-id-card:before {
  content: "\f2c2"; }

.fa-id-card-alt:before {
  content: "\f47f"; }

.fa-ideal:before {
  content: "\f913"; }

.fa-igloo:before {
  content: "\f7ae"; }

.fa-image:before {
  content: "\f03e"; }

.fa-images:before {
  content: "\f302"; }

.fa-imdb:before {
  content: "\f2d8"; }

.fa-inbox:before {
  content: "\f01c"; }

.fa-indent:before {
  content: "\f03c"; }

.fa-industry:before {
  content: "\f275"; }

.fa-infinity:before {
  content: "\f534"; }

.fa-info:before {
  content: "\f129"; }

.fa-info-circle:before {
  content: "\f05a"; }

.fa-instagram:before {
  content: "\f16d"; }

.fa-instagram-square:before {
  content: "\f955"; }

.fa-intercom:before {
  content: "\f7af"; }

.fa-internet-explorer:before {
  content: "\f26b"; }

.fa-invision:before {
  content: "\f7b0"; }

.fa-ioxhost:before {
  content: "\f208"; }

.fa-italic:before {
  content: "\f033"; }

.fa-itch-io:before {
  content: "\f83a"; }

.fa-itunes:before {
  content: "\f3b4"; }

.fa-itunes-note:before {
  content: "\f3b5"; }

.fa-java:before {
  content: "\f4e4"; }

.fa-jedi:before {
  content: "\f669"; }

.fa-jedi-order:before {
  content: "\f50e"; }

.fa-jenkins:before {
  content: "\f3b6"; }

.fa-jira:before {
  content: "\f7b1"; }

.fa-joget:before {
  content: "\f3b7"; }

.fa-joint:before {
  content: "\f595"; }

.fa-joomla:before {
  content: "\f1aa"; }

.fa-journal-whills:before {
  content: "\f66a"; }

.fa-js:before {
  content: "\f3b8"; }

.fa-js-square:before {
  content: "\f3b9"; }

.fa-jsfiddle:before {
  content: "\f1cc"; }

.fa-kaaba:before {
  content: "\f66b"; }

.fa-kaggle:before {
  content: "\f5fa"; }

.fa-key:before {
  content: "\f084"; }

.fa-keybase:before {
  content: "\f4f5"; }

.fa-keyboard:before {
  content: "\f11c"; }

.fa-keycdn:before {
  content: "\f3ba"; }

.fa-khanda:before {
  content: "\f66d"; }

.fa-kickstarter:before {
  content: "\f3bb"; }

.fa-kickstarter-k:before {
  content: "\f3bc"; }

.fa-kiss:before {
  content: "\f596"; }

.fa-kiss-beam:before {
  content: "\f597"; }

.fa-kiss-wink-heart:before {
  content: "\f598"; }

.fa-kiwi-bird:before {
  content: "\f535"; }

.fa-korvue:before {
  content: "\f42f"; }

.fa-landmark:before {
  content: "\f66f"; }

.fa-language:before {
  content: "\f1ab"; }

.fa-laptop:before {
  content: "\f109"; }

.fa-laptop-code:before {
  content: "\f5fc"; }

.fa-laptop-house:before {
  content: "\f966"; }

.fa-laptop-medical:before {
  content: "\f812"; }

.fa-laravel:before {
  content: "\f3bd"; }

.fa-lastfm:before {
  content: "\f202"; }

.fa-lastfm-square:before {
  content: "\f203"; }

.fa-laugh:before {
  content: "\f599"; }

.fa-laugh-beam:before {
  content: "\f59a"; }

.fa-laugh-squint:before {
  content: "\f59b"; }

.fa-laugh-wink:before {
  content: "\f59c"; }

.fa-layer-group:before {
  content: "\f5fd"; }

.fa-leaf:before {
  content: "\f06c"; }

.fa-leanpub:before {
  content: "\f212"; }

.fa-lemon:before {
  content: "\f094"; }

.fa-less:before {
  content: "\f41d"; }

.fa-less-than:before {
  content: "\f536"; }

.fa-less-than-equal:before {
  content: "\f537"; }

.fa-level-down-alt:before {
  content: "\f3be"; }

.fa-level-up-alt:before {
  content: "\f3bf"; }

.fa-life-ring:before {
  content: "\f1cd"; }

.fa-lightbulb:before {
  content: "\f0eb"; }

.fa-line:before {
  content: "\f3c0"; }

.fa-link:before {
  content: "\f0c1"; }

.fa-linkedin:before {
  content: "\f08c"; }

.fa-linkedin-in:before {
  content: "\f0e1"; }

.fa-linode:before {
  content: "\f2b8"; }

.fa-linux:before {
  content: "\f17c"; }

.fa-lira-sign:before {
  content: "\f195"; }

.fa-list:before {
  content: "\f03a"; }

.fa-list-alt:before {
  content: "\f022"; }

.fa-list-ol:before {
  content: "\f0cb"; }

.fa-list-ul:before {
  content: "\f0ca"; }

.fa-location-arrow:before {
  content: "\f124"; }

.fa-lock:before {
  content: "\f023"; }

.fa-lock-open:before {
  content: "\f3c1"; }

.fa-long-arrow-alt-down:before {
  content: "\f309"; }

.fa-long-arrow-alt-left:before {
  content: "\f30a"; }

.fa-long-arrow-alt-right:before {
  content: "\f30b"; }

.fa-long-arrow-alt-up:before {
  content: "\f30c"; }

.fa-low-vision:before {
  content: "\f2a8"; }

.fa-luggage-cart:before {
  content: "\f59d"; }

.fa-lungs:before {
  content: "\f604"; }

.fa-lungs-virus:before {
  content: "\f967"; }

.fa-lyft:before {
  content: "\f3c3"; }

.fa-magento:before {
  content: "\f3c4"; }

.fa-magic:before {
  content: "\f0d0"; }

.fa-magnet:before {
  content: "\f076"; }

.fa-mail-bulk:before {
  content: "\f674"; }

.fa-mailchimp:before {
  content: "\f59e"; }

.fa-male:before {
  content: "\f183"; }

.fa-mandalorian:before {
  content: "\f50f"; }

.fa-map:before {
  content: "\f279"; }

.fa-map-marked:before {
  content: "\f59f"; }

.fa-map-marked-alt:before {
  content: "\f5a0"; }

.fa-map-marker:before {
  content: "\f041"; }

.fa-map-marker-alt:before {
  content: "\f3c5"; }

.fa-map-pin:before {
  content: "\f276"; }

.fa-map-signs:before {
  content: "\f277"; }

.fa-markdown:before {
  content: "\f60f"; }

.fa-marker:before {
  content: "\f5a1"; }

.fa-mars:before {
  content: "\f222"; }

.fa-mars-double:before {
  content: "\f227"; }

.fa-mars-stroke:before {
  content: "\f229"; }

.fa-mars-stroke-h:before {
  content: "\f22b"; }

.fa-mars-stroke-v:before {
  content: "\f22a"; }

.fa-mask:before {
  content: "\f6fa"; }

.fa-mastodon:before {
  content: "\f4f6"; }

.fa-maxcdn:before {
  content: "\f136"; }

.fa-mdb:before {
  content: "\f8ca"; }

.fa-medal:before {
  content: "\f5a2"; }

.fa-medapps:before {
  content: "\f3c6"; }

.fa-medium:before {
  content: "\f23a"; }

.fa-medium-m:before {
  content: "\f3c7"; }

.fa-medkit:before {
  content: "\f0fa"; }

.fa-medrt:before {
  content: "\f3c8"; }

.fa-meetup:before {
  content: "\f2e0"; }

.fa-megaport:before {
  content: "\f5a3"; }

.fa-meh:before {
  content: "\f11a"; }

.fa-meh-blank:before {
  content: "\f5a4"; }

.fa-meh-rolling-eyes:before {
  content: "\f5a5"; }

.fa-memory:before {
  content: "\f538"; }

.fa-mendeley:before {
  content: "\f7b3"; }

.fa-menorah:before {
  content: "\f676"; }

.fa-mercury:before {
  content: "\f223"; }

.fa-meteor:before {
  content: "\f753"; }

.fa-microblog:before {
  content: "\f91a"; }

.fa-microchip:before {
  content: "\f2db"; }

.fa-microphone:before {
  content: "\f130"; }

.fa-microphone-alt:before {
  content: "\f3c9"; }

.fa-microphone-alt-slash:before {
  content: "\f539"; }

.fa-microphone-slash:before {
  content: "\f131"; }

.fa-microscope:before {
  content: "\f610"; }

.fa-microsoft:before {
  content: "\f3ca"; }

.fa-minus:before {
  content: "\f068"; }

.fa-minus-circle:before {
  content: "\f056"; }

.fa-minus-square:before {
  content: "\f146"; }

.fa-mitten:before {
  content: "\f7b5"; }

.fa-mix:before {
  content: "\f3cb"; }

.fa-mixcloud:before {
  content: "\f289"; }

.fa-mixer:before {
  content: "\f956"; }

.fa-mizuni:before {
  content: "\f3cc"; }

.fa-mobile:before {
  content: "\f10b"; }

.fa-mobile-alt:before {
  content: "\f3cd"; }

.fa-modx:before {
  content: "\f285"; }

.fa-monero:before {
  content: "\f3d0"; }

.fa-money-bill:before {
  content: "\f0d6"; }

.fa-money-bill-alt:before {
  content: "\f3d1"; }

.fa-money-bill-wave:before {
  content: "\f53a"; }

.fa-money-bill-wave-alt:before {
  content: "\f53b"; }

.fa-money-check:before {
  content: "\f53c"; }

.fa-money-check-alt:before {
  content: "\f53d"; }

.fa-monument:before {
  content: "\f5a6"; }

.fa-moon:before {
  content: "\f186"; }

.fa-mortar-pestle:before {
  content: "\f5a7"; }

.fa-mosque:before {
  content: "\f678"; }

.fa-motorcycle:before {
  content: "\f21c"; }

.fa-mountain:before {
  content: "\f6fc"; }

.fa-mouse:before {
  content: "\f8cc"; }

.fa-mouse-pointer:before {
  content: "\f245"; }

.fa-mug-hot:before {
  content: "\f7b6"; }

.fa-music:before {
  content: "\f001"; }

.fa-napster:before {
  content: "\f3d2"; }

.fa-neos:before {
  content: "\f612"; }

.fa-network-wired:before {
  content: "\f6ff"; }

.fa-neuter:before {
  content: "\f22c"; }

.fa-newspaper:before {
  content: "\f1ea"; }

.fa-nimblr:before {
  content: "\f5a8"; }

.fa-node:before {
  content: "\f419"; }

.fa-node-js:before {
  content: "\f3d3"; }

.fa-not-equal:before {
  content: "\f53e"; }

.fa-notes-medical:before {
  content: "\f481"; }

.fa-npm:before {
  content: "\f3d4"; }

.fa-ns8:before {
  content: "\f3d5"; }

.fa-nutritionix:before {
  content: "\f3d6"; }

.fa-object-group:before {
  content: "\f247"; }

.fa-object-ungroup:before {
  content: "\f248"; }

.fa-odnoklassniki:before {
  content: "\f263"; }

.fa-odnoklassniki-square:before {
  content: "\f264"; }

.fa-oil-can:before {
  content: "\f613"; }

.fa-old-republic:before {
  content: "\f510"; }

.fa-om:before {
  content: "\f679"; }

.fa-opencart:before {
  content: "\f23d"; }

.fa-openid:before {
  content: "\f19b"; }

.fa-opera:before {
  content: "\f26a"; }

.fa-optin-monster:before {
  content: "\f23c"; }

.fa-orcid:before {
  content: "\f8d2"; }

.fa-osi:before {
  content: "\f41a"; }

.fa-otter:before {
  content: "\f700"; }

.fa-outdent:before {
  content: "\f03b"; }

.fa-page4:before {
  content: "\f3d7"; }

.fa-pagelines:before {
  content: "\f18c"; }

.fa-pager:before {
  content: "\f815"; }

.fa-paint-brush:before {
  content: "\f1fc"; }

.fa-paint-roller:before {
  content: "\f5aa"; }

.fa-palette:before {
  content: "\f53f"; }

.fa-palfed:before {
  content: "\f3d8"; }

.fa-pallet:before {
  content: "\f482"; }

.fa-paper-plane:before {
  content: "\f1d8"; }

.fa-paperclip:before {
  content: "\f0c6"; }

.fa-parachute-box:before {
  content: "\f4cd"; }

.fa-paragraph:before {
  content: "\f1dd"; }

.fa-parking:before {
  content: "\f540"; }

.fa-passport:before {
  content: "\f5ab"; }

.fa-pastafarianism:before {
  content: "\f67b"; }

.fa-paste:before {
  content: "\f0ea"; }

.fa-patreon:before {
  content: "\f3d9"; }

.fa-pause:before {
  content: "\f04c"; }

.fa-pause-circle:before {
  content: "\f28b"; }

.fa-paw:before {
  content: "\f1b0"; }

.fa-paypal:before {
  content: "\f1ed"; }

.fa-peace:before {
  content: "\f67c"; }

.fa-pen:before {
  content: "\f304"; }

.fa-pen-alt:before {
  content: "\f305"; }

.fa-pen-fancy:before {
  content: "\f5ac"; }

.fa-pen-nib:before {
  content: "\f5ad"; }

.fa-pen-square:before {
  content: "\f14b"; }

.fa-pencil-alt:before {
  content: "\f303"; }

.fa-pencil-ruler:before {
  content: "\f5ae"; }

.fa-penny-arcade:before {
  content: "\f704"; }

.fa-people-arrows:before {
  content: "\f968"; }

.fa-people-carry:before {
  content: "\f4ce"; }

.fa-pepper-hot:before {
  content: "\f816"; }

.fa-percent:before {
  content: "\f295"; }

.fa-percentage:before {
  content: "\f541"; }

.fa-periscope:before {
  content: "\f3da"; }

.fa-person-booth:before {
  content: "\f756"; }

.fa-phabricator:before {
  content: "\f3db"; }

.fa-phoenix-framework:before {
  content: "\f3dc"; }

.fa-phoenix-squadron:before {
  content: "\f511"; }

.fa-phone:before {
  content: "\f095"; }

.fa-phone-alt:before {
  content: "\f879"; }

.fa-phone-slash:before {
  content: "\f3dd"; }

.fa-phone-square:before {
  content: "\f098"; }

.fa-phone-square-alt:before {
  content: "\f87b"; }

.fa-phone-volume:before {
  content: "\f2a0"; }

.fa-photo-video:before {
  content: "\f87c"; }

.fa-php:before {
  content: "\f457"; }

.fa-pied-piper:before {
  content: "\f2ae"; }

.fa-pied-piper-alt:before {
  content: "\f1a8"; }

.fa-pied-piper-hat:before {
  content: "\f4e5"; }

.fa-pied-piper-pp:before {
  content: "\f1a7"; }

.fa-pied-piper-square:before {
  content: "\f91e"; }

.fa-piggy-bank:before {
  content: "\f4d3"; }

.fa-pills:before {
  content: "\f484"; }

.fa-pinterest:before {
  content: "\f0d2"; }

.fa-pinterest-p:before {
  content: "\f231"; }

.fa-pinterest-square:before {
  content: "\f0d3"; }

.fa-pizza-slice:before {
  content: "\f818"; }

.fa-place-of-worship:before {
  content: "\f67f"; }

.fa-plane:before {
  content: "\f072"; }

.fa-plane-arrival:before {
  content: "\f5af"; }

.fa-plane-departure:before {
  content: "\f5b0"; }

.fa-plane-slash:before {
  content: "\f969"; }

.fa-play:before {
  content: "\f04b"; }

.fa-play-circle:before {
  content: "\f144"; }

.fa-playstation:before {
  content: "\f3df"; }

.fa-plug:before {
  content: "\f1e6"; }

.fa-plus:before {
  content: "\f067"; }

.fa-plus-circle:before {
  content: "\f055"; }

.fa-plus-square:before {
  content: "\f0fe"; }

.fa-podcast:before {
  content: "\f2ce"; }

.fa-poll:before {
  content: "\f681"; }

.fa-poll-h:before {
  content: "\f682"; }

.fa-poo:before {
  content: "\f2fe"; }

.fa-poo-storm:before {
  content: "\f75a"; }

.fa-poop:before {
  content: "\f619"; }

.fa-portrait:before {
  content: "\f3e0"; }

.fa-pound-sign:before {
  content: "\f154"; }

.fa-power-off:before {
  content: "\f011"; }

.fa-pray:before {
  content: "\f683"; }

.fa-praying-hands:before {
  content: "\f684"; }

.fa-prescription:before {
  content: "\f5b1"; }

.fa-prescription-bottle:before {
  content: "\f485"; }

.fa-prescription-bottle-alt:before {
  content: "\f486"; }

.fa-print:before {
  content: "\f02f"; }

.fa-procedures:before {
  content: "\f487"; }

.fa-product-hunt:before {
  content: "\f288"; }

.fa-project-diagram:before {
  content: "\f542"; }

.fa-pump-medical:before {
  content: "\f96a"; }

.fa-pump-soap:before {
  content: "\f96b"; }

.fa-pushed:before {
  content: "\f3e1"; }

.fa-puzzle-piece:before {
  content: "\f12e"; }

.fa-python:before {
  content: "\f3e2"; }

.fa-qq:before {
  content: "\f1d6"; }

.fa-qrcode:before {
  content: "\f029"; }

.fa-question:before {
  content: "\f128"; }

.fa-question-circle:before {
  content: "\f059"; }

.fa-quidditch:before {
  content: "\f458"; }

.fa-quinscape:before {
  content: "\f459"; }

.fa-quora:before {
  content: "\f2c4"; }

.fa-quote-left:before {
  content: "\f10d"; }

.fa-quote-right:before {
  content: "\f10e"; }

.fa-quran:before {
  content: "\f687"; }

.fa-r-project:before {
  content: "\f4f7"; }

.fa-radiation:before {
  content: "\f7b9"; }

.fa-radiation-alt:before {
  content: "\f7ba"; }

.fa-rainbow:before {
  content: "\f75b"; }

.fa-random:before {
  content: "\f074"; }

.fa-raspberry-pi:before {
  content: "\f7bb"; }

.fa-ravelry:before {
  content: "\f2d9"; }

.fa-react:before {
  content: "\f41b"; }

.fa-reacteurope:before {
  content: "\f75d"; }

.fa-readme:before {
  content: "\f4d5"; }

.fa-rebel:before {
  content: "\f1d0"; }

.fa-receipt:before {
  content: "\f543"; }

.fa-record-vinyl:before {
  content: "\f8d9"; }

.fa-recycle:before {
  content: "\f1b8"; }

.fa-red-river:before {
  content: "\f3e3"; }

.fa-reddit:before {
  content: "\f1a1"; }

.fa-reddit-alien:before {
  content: "\f281"; }

.fa-reddit-square:before {
  content: "\f1a2"; }

.fa-redhat:before {
  content: "\f7bc"; }

.fa-redo:before {
  content: "\f01e"; }

.fa-redo-alt:before {
  content: "\f2f9"; }

.fa-registered:before {
  content: "\f25d"; }

.fa-remove-format:before {
  content: "\f87d"; }

.fa-renren:before {
  content: "\f18b"; }

.fa-reply:before {
  content: "\f3e5"; }

.fa-reply-all:before {
  content: "\f122"; }

.fa-replyd:before {
  content: "\f3e6"; }

.fa-republican:before {
  content: "\f75e"; }

.fa-researchgate:before {
  content: "\f4f8"; }

.fa-resolving:before {
  content: "\f3e7"; }

.fa-restroom:before {
  content: "\f7bd"; }

.fa-retweet:before {
  content: "\f079"; }

.fa-rev:before {
  content: "\f5b2"; }

.fa-ribbon:before {
  content: "\f4d6"; }

.fa-ring:before {
  content: "\f70b"; }

.fa-road:before {
  content: "\f018"; }

.fa-robot:before {
  content: "\f544"; }

.fa-rocket:before {
  content: "\f135"; }

.fa-rocketchat:before {
  content: "\f3e8"; }

.fa-rockrms:before {
  content: "\f3e9"; }

.fa-route:before {
  content: "\f4d7"; }

.fa-rss:before {
  content: "\f09e"; }

.fa-rss-square:before {
  content: "\f143"; }

.fa-ruble-sign:before {
  content: "\f158"; }

.fa-ruler:before {
  content: "\f545"; }

.fa-ruler-combined:before {
  content: "\f546"; }

.fa-ruler-horizontal:before {
  content: "\f547"; }

.fa-ruler-vertical:before {
  content: "\f548"; }

.fa-running:before {
  content: "\f70c"; }

.fa-rupee-sign:before {
  content: "\f156"; }

.fa-sad-cry:before {
  content: "\f5b3"; }

.fa-sad-tear:before {
  content: "\f5b4"; }

.fa-safari:before {
  content: "\f267"; }

.fa-salesforce:before {
  content: "\f83b"; }

.fa-sass:before {
  content: "\f41e"; }

.fa-satellite:before {
  content: "\f7bf"; }

.fa-satellite-dish:before {
  content: "\f7c0"; }

.fa-save:before {
  content: "\f0c7"; }

.fa-schlix:before {
  content: "\f3ea"; }

.fa-school:before {
  content: "\f549"; }

.fa-screwdriver:before {
  content: "\f54a"; }

.fa-scribd:before {
  content: "\f28a"; }

.fa-scroll:before {
  content: "\f70e"; }

.fa-sd-card:before {
  content: "\f7c2"; }

.fa-search:before {
  content: "\f002"; }

.fa-search-dollar:before {
  content: "\f688"; }

.fa-search-location:before {
  content: "\f689"; }

.fa-search-minus:before {
  content: "\f010"; }

.fa-search-plus:before {
  content: "\f00e"; }

.fa-searchengin:before {
  content: "\f3eb"; }

.fa-seedling:before {
  content: "\f4d8"; }

.fa-sellcast:before {
  content: "\f2da"; }

.fa-sellsy:before {
  content: "\f213"; }

.fa-server:before {
  content: "\f233"; }

.fa-servicestack:before {
  content: "\f3ec"; }

.fa-shapes:before {
  content: "\f61f"; }

.fa-share:before {
  content: "\f064"; }

.fa-share-alt:before {
  content: "\f1e0"; }

.fa-share-alt-square:before {
  content: "\f1e1"; }

.fa-share-square:before {
  content: "\f14d"; }

.fa-shekel-sign:before {
  content: "\f20b"; }

.fa-shield-alt:before {
  content: "\f3ed"; }

.fa-shield-virus:before {
  content: "\f96c"; }

.fa-ship:before {
  content: "\f21a"; }

.fa-shipping-fast:before {
  content: "\f48b"; }

.fa-shirtsinbulk:before {
  content: "\f214"; }

.fa-shoe-prints:before {
  content: "\f54b"; }

.fa-shopify:before {
  content: "\f957"; }

.fa-shopping-bag:before {
  content: "\f290"; }

.fa-shopping-basket:before {
  content: "\f291"; }

.fa-shopping-cart:before {
  content: "\f07a"; }

.fa-shopware:before {
  content: "\f5b5"; }

.fa-shower:before {
  content: "\f2cc"; }

.fa-shuttle-van:before {
  content: "\f5b6"; }

.fa-sign:before {
  content: "\f4d9"; }

.fa-sign-in-alt:before {
  content: "\f2f6"; }

.fa-sign-language:before {
  content: "\f2a7"; }

.fa-sign-out-alt:before {
  content: "\f2f5"; }

.fa-signal:before {
  content: "\f012"; }

.fa-signature:before {
  content: "\f5b7"; }

.fa-sim-card:before {
  content: "\f7c4"; }

.fa-simplybuilt:before {
  content: "\f215"; }

.fa-sistrix:before {
  content: "\f3ee"; }

.fa-sitemap:before {
  content: "\f0e8"; }

.fa-sith:before {
  content: "\f512"; }

.fa-skating:before {
  content: "\f7c5"; }

.fa-sketch:before {
  content: "\f7c6"; }

.fa-skiing:before {
  content: "\f7c9"; }

.fa-skiing-nordic:before {
  content: "\f7ca"; }

.fa-skull:before {
  content: "\f54c"; }

.fa-skull-crossbones:before {
  content: "\f714"; }

.fa-skyatlas:before {
  content: "\f216"; }

.fa-skype:before {
  content: "\f17e"; }

.fa-slack:before {
  content: "\f198"; }

.fa-slack-hash:before {
  content: "\f3ef"; }

.fa-slash:before {
  content: "\f715"; }

.fa-sleigh:before {
  content: "\f7cc"; }

.fa-sliders-h:before {
  content: "\f1de"; }

.fa-slideshare:before {
  content: "\f1e7"; }

.fa-smile:before {
  content: "\f118"; }

.fa-smile-beam:before {
  content: "\f5b8"; }

.fa-smile-wink:before {
  content: "\f4da"; }

.fa-smog:before {
  content: "\f75f"; }

.fa-smoking:before {
  content: "\f48d"; }

.fa-smoking-ban:before {
  content: "\f54d"; }

.fa-sms:before {
  content: "\f7cd"; }

.fa-snapchat:before {
  content: "\f2ab"; }

.fa-snapchat-ghost:before {
  content: "\f2ac"; }

.fa-snapchat-square:before {
  content: "\f2ad"; }

.fa-snowboarding:before {
  content: "\f7ce"; }

.fa-snowflake:before {
  content: "\f2dc"; }

.fa-snowman:before {
  content: "\f7d0"; }

.fa-snowplow:before {
  content: "\f7d2"; }

.fa-soap:before {
  content: "\f96e"; }

.fa-socks:before {
  content: "\f696"; }

.fa-solar-panel:before {
  content: "\f5ba"; }

.fa-sort:before {
  content: "\f0dc"; }

.fa-sort-alpha-down:before {
  content: "\f15d"; }

.fa-sort-alpha-down-alt:before {
  content: "\f881"; }

.fa-sort-alpha-up:before {
  content: "\f15e"; }

.fa-sort-alpha-up-alt:before {
  content: "\f882"; }

.fa-sort-amount-down:before {
  content: "\f160"; }

.fa-sort-amount-down-alt:before {
  content: "\f884"; }

.fa-sort-amount-up:before {
  content: "\f161"; }

.fa-sort-amount-up-alt:before {
  content: "\f885"; }

.fa-sort-down:before {
  content: "\f0dd"; }

.fa-sort-numeric-down:before {
  content: "\f162"; }

.fa-sort-numeric-down-alt:before {
  content: "\f886"; }

.fa-sort-numeric-up:before {
  content: "\f163"; }

.fa-sort-numeric-up-alt:before {
  content: "\f887"; }

.fa-sort-up:before {
  content: "\f0de"; }

.fa-soundcloud:before {
  content: "\f1be"; }

.fa-sourcetree:before {
  content: "\f7d3"; }

.fa-spa:before {
  content: "\f5bb"; }

.fa-space-shuttle:before {
  content: "\f197"; }

.fa-speakap:before {
  content: "\f3f3"; }

.fa-speaker-deck:before {
  content: "\f83c"; }

.fa-spell-check:before {
  content: "\f891"; }

.fa-spider:before {
  content: "\f717"; }

.fa-spinner:before {
  content: "\f110"; }

.fa-splotch:before {
  content: "\f5bc"; }

.fa-spotify:before {
  content: "\f1bc"; }

.fa-spray-can:before {
  content: "\f5bd"; }

.fa-square:before {
  content: "\f0c8"; }

.fa-square-full:before {
  content: "\f45c"; }

.fa-square-root-alt:before {
  content: "\f698"; }

.fa-squarespace:before {
  content: "\f5be"; }

.fa-stack-exchange:before {
  content: "\f18d"; }

.fa-stack-overflow:before {
  content: "\f16c"; }

.fa-stackpath:before {
  content: "\f842"; }

.fa-stamp:before {
  content: "\f5bf"; }

.fa-star:before {
  content: "\f005"; }

.fa-star-and-crescent:before {
  content: "\f699"; }

.fa-star-half:before {
  content: "\f089"; }

.fa-star-half-alt:before {
  content: "\f5c0"; }

.fa-star-of-david:before {
  content: "\f69a"; }

.fa-star-of-life:before {
  content: "\f621"; }

.fa-staylinked:before {
  content: "\f3f5"; }

.fa-steam:before {
  content: "\f1b6"; }

.fa-steam-square:before {
  content: "\f1b7"; }

.fa-steam-symbol:before {
  content: "\f3f6"; }

.fa-step-backward:before {
  content: "\f048"; }

.fa-step-forward:before {
  content: "\f051"; }

.fa-stethoscope:before {
  content: "\f0f1"; }

.fa-sticker-mule:before {
  content: "\f3f7"; }

.fa-sticky-note:before {
  content: "\f249"; }

.fa-stop:before {
  content: "\f04d"; }

.fa-stop-circle:before {
  content: "\f28d"; }

.fa-stopwatch:before {
  content: "\f2f2"; }

.fa-stopwatch-20:before {
  content: "\f96f"; }

.fa-store:before {
  content: "\f54e"; }

.fa-store-alt:before {
  content: "\f54f"; }

.fa-store-alt-slash:before {
  content: "\f970"; }

.fa-store-slash:before {
  content: "\f971"; }

.fa-strava:before {
  content: "\f428"; }

.fa-stream:before {
  content: "\f550"; }

.fa-street-view:before {
  content: "\f21d"; }

.fa-strikethrough:before {
  content: "\f0cc"; }

.fa-stripe:before {
  content: "\f429"; }

.fa-stripe-s:before {
  content: "\f42a"; }

.fa-stroopwafel:before {
  content: "\f551"; }

.fa-studiovinari:before {
  content: "\f3f8"; }

.fa-stumbleupon:before {
  content: "\f1a4"; }

.fa-stumbleupon-circle:before {
  content: "\f1a3"; }

.fa-subscript:before {
  content: "\f12c"; }

.fa-subway:before {
  content: "\f239"; }

.fa-suitcase:before {
  content: "\f0f2"; }

.fa-suitcase-rolling:before {
  content: "\f5c1"; }

.fa-sun:before {
  content: "\f185"; }

.fa-superpowers:before {
  content: "\f2dd"; }

.fa-superscript:before {
  content: "\f12b"; }

.fa-supple:before {
  content: "\f3f9"; }

.fa-surprise:before {
  content: "\f5c2"; }

.fa-suse:before {
  content: "\f7d6"; }

.fa-swatchbook:before {
  content: "\f5c3"; }

.fa-swift:before {
  content: "\f8e1"; }

.fa-swimmer:before {
  content: "\f5c4"; }

.fa-swimming-pool:before {
  content: "\f5c5"; }

.fa-symfony:before {
  content: "\f83d"; }

.fa-synagogue:before {
  content: "\f69b"; }

.fa-sync:before {
  content: "\f021"; }

.fa-sync-alt:before {
  content: "\f2f1"; }

.fa-syringe:before {
  content: "\f48e"; }

.fa-table:before {
  content: "\f0ce"; }

.fa-table-tennis:before {
  content: "\f45d"; }

.fa-tablet:before {
  content: "\f10a"; }

.fa-tablet-alt:before {
  content: "\f3fa"; }

.fa-tablets:before {
  content: "\f490"; }

.fa-tachometer-alt:before {
  content: "\f3fd"; }

.fa-tag:before {
  content: "\f02b"; }

.fa-tags:before {
  content: "\f02c"; }

.fa-tape:before {
  content: "\f4db"; }

.fa-tasks:before {
  content: "\f0ae"; }

.fa-taxi:before {
  content: "\f1ba"; }

.fa-teamspeak:before {
  content: "\f4f9"; }

.fa-teeth:before {
  content: "\f62e"; }

.fa-teeth-open:before {
  content: "\f62f"; }

.fa-telegram:before {
  content: "\f2c6"; }

.fa-telegram-plane:before {
  content: "\f3fe"; }

.fa-temperature-high:before {
  content: "\f769"; }

.fa-temperature-low:before {
  content: "\f76b"; }

.fa-tencent-weibo:before {
  content: "\f1d5"; }

.fa-tenge:before {
  content: "\f7d7"; }

.fa-terminal:before {
  content: "\f120"; }

.fa-text-height:before {
  content: "\f034"; }

.fa-text-width:before {
  content: "\f035"; }

.fa-th:before {
  content: "\f00a"; }

.fa-th-large:before {
  content: "\f009"; }

.fa-th-list:before {
  content: "\f00b"; }

.fa-the-red-yeti:before {
  content: "\f69d"; }

.fa-theater-masks:before {
  content: "\f630"; }

.fa-themeco:before {
  content: "\f5c6"; }

.fa-themeisle:before {
  content: "\f2b2"; }

.fa-thermometer:before {
  content: "\f491"; }

.fa-thermometer-empty:before {
  content: "\f2cb"; }

.fa-thermometer-full:before {
  content: "\f2c7"; }

.fa-thermometer-half:before {
  content: "\f2c9"; }

.fa-thermometer-quarter:before {
  content: "\f2ca"; }

.fa-thermometer-three-quarters:before {
  content: "\f2c8"; }

.fa-think-peaks:before {
  content: "\f731"; }

.fa-thumbs-down:before {
  content: "\f165"; }

.fa-thumbs-up:before {
  content: "\f164"; }

.fa-thumbtack:before {
  content: "\f08d"; }

.fa-ticket-alt:before {
  content: "\f3ff"; }

.fa-times:before {
  content: "\f00d"; }

.fa-times-circle:before {
  content: "\f057"; }

.fa-tint:before {
  content: "\f043"; }

.fa-tint-slash:before {
  content: "\f5c7"; }

.fa-tired:before {
  content: "\f5c8"; }

.fa-toggle-off:before {
  content: "\f204"; }

.fa-toggle-on:before {
  content: "\f205"; }

.fa-toilet:before {
  content: "\f7d8"; }

.fa-toilet-paper:before {
  content: "\f71e"; }

.fa-toilet-paper-slash:before {
  content: "\f972"; }

.fa-toolbox:before {
  content: "\f552"; }

.fa-tools:before {
  content: "\f7d9"; }

.fa-tooth:before {
  content: "\f5c9"; }

.fa-torah:before {
  content: "\f6a0"; }

.fa-torii-gate:before {
  content: "\f6a1"; }

.fa-tractor:before {
  content: "\f722"; }

.fa-trade-federation:before {
  content: "\f513"; }

.fa-trademark:before {
  content: "\f25c"; }

.fa-traffic-light:before {
  content: "\f637"; }

.fa-trailer:before {
  content: "\f941"; }

.fa-train:before {
  content: "\f238"; }

.fa-tram:before {
  content: "\f7da"; }

.fa-transgender:before {
  content: "\f224"; }

.fa-transgender-alt:before {
  content: "\f225"; }

.fa-trash:before {
  content: "\f1f8"; }

.fa-trash-alt:before {
  content: "\f2ed"; }

.fa-trash-restore:before {
  content: "\f829"; }

.fa-trash-restore-alt:before {
  content: "\f82a"; }

.fa-tree:before {
  content: "\f1bb"; }

.fa-trello:before {
  content: "\f181"; }

.fa-tripadvisor:before {
  content: "\f262"; }

.fa-trophy:before {
  content: "\f091"; }

.fa-truck:before {
  content: "\f0d1"; }

.fa-truck-loading:before {
  content: "\f4de"; }

.fa-truck-monster:before {
  content: "\f63b"; }

.fa-truck-moving:before {
  content: "\f4df"; }

.fa-truck-pickup:before {
  content: "\f63c"; }

.fa-tshirt:before {
  content: "\f553"; }

.fa-tty:before {
  content: "\f1e4"; }

.fa-tumblr:before {
  content: "\f173"; }

.fa-tumblr-square:before {
  content: "\f174"; }

.fa-tv:before {
  content: "\f26c"; }

.fa-twitch:before {
  content: "\f1e8"; }

.fa-twitter:before {
  content: "\f099"; }

.fa-twitter-square:before {
  content: "\f081"; }

.fa-typo3:before {
  content: "\f42b"; }

.fa-uber:before {
  content: "\f402"; }

.fa-ubuntu:before {
  content: "\f7df"; }

.fa-uikit:before {
  content: "\f403"; }

.fa-umbraco:before {
  content: "\f8e8"; }

.fa-umbrella:before {
  content: "\f0e9"; }

.fa-umbrella-beach:before {
  content: "\f5ca"; }

.fa-underline:before {
  content: "\f0cd"; }

.fa-undo:before {
  content: "\f0e2"; }

.fa-undo-alt:before {
  content: "\f2ea"; }

.fa-uniregistry:before {
  content: "\f404"; }

.fa-unity:before {
  content: "\f949"; }

.fa-universal-access:before {
  content: "\f29a"; }

.fa-university:before {
  content: "\f19c"; }

.fa-unlink:before {
  content: "\f127"; }

.fa-unlock:before {
  content: "\f09c"; }

.fa-unlock-alt:before {
  content: "\f13e"; }

.fa-untappd:before {
  content: "\f405"; }

.fa-upload:before {
  content: "\f093"; }

.fa-ups:before {
  content: "\f7e0"; }

.fa-usb:before {
  content: "\f287"; }

.fa-user:before {
  content: "\f007"; }

.fa-user-alt:before {
  content: "\f406"; }

.fa-user-alt-slash:before {
  content: "\f4fa"; }

.fa-user-astronaut:before {
  content: "\f4fb"; }

.fa-user-check:before {
  content: "\f4fc"; }

.fa-user-circle:before {
  content: "\f2bd"; }

.fa-user-clock:before {
  content: "\f4fd"; }

.fa-user-cog:before {
  content: "\f4fe"; }

.fa-user-edit:before {
  content: "\f4ff"; }

.fa-user-friends:before {
  content: "\f500"; }

.fa-user-graduate:before {
  content: "\f501"; }

.fa-user-injured:before {
  content: "\f728"; }

.fa-user-lock:before {
  content: "\f502"; }

.fa-user-md:before {
  content: "\f0f0"; }

.fa-user-minus:before {
  content: "\f503"; }

.fa-user-ninja:before {
  content: "\f504"; }

.fa-user-nurse:before {
  content: "\f82f"; }

.fa-user-plus:before {
  content: "\f234"; }

.fa-user-secret:before {
  content: "\f21b"; }

.fa-user-shield:before {
  content: "\f505"; }

.fa-user-slash:before {
  content: "\f506"; }

.fa-user-tag:before {
  content: "\f507"; }

.fa-user-tie:before {
  content: "\f508"; }

.fa-user-times:before {
  content: "\f235"; }

.fa-users:before {
  content: "\f0c0"; }

.fa-users-cog:before {
  content: "\f509"; }

.fa-usps:before {
  content: "\f7e1"; }

.fa-ussunnah:before {
  content: "\f407"; }

.fa-utensil-spoon:before {
  content: "\f2e5"; }

.fa-utensils:before {
  content: "\f2e7"; }

.fa-vaadin:before {
  content: "\f408"; }

.fa-vector-square:before {
  content: "\f5cb"; }

.fa-venus:before {
  content: "\f221"; }

.fa-venus-double:before {
  content: "\f226"; }

.fa-venus-mars:before {
  content: "\f228"; }

.fa-viacoin:before {
  content: "\f237"; }

.fa-viadeo:before {
  content: "\f2a9"; }

.fa-viadeo-square:before {
  content: "\f2aa"; }

.fa-vial:before {
  content: "\f492"; }

.fa-vials:before {
  content: "\f493"; }

.fa-viber:before {
  content: "\f409"; }

.fa-video:before {
  content: "\f03d"; }

.fa-video-slash:before {
  content: "\f4e2"; }

.fa-vihara:before {
  content: "\f6a7"; }

.fa-vimeo:before {
  content: "\f40a"; }

.fa-vimeo-square:before {
  content: "\f194"; }

.fa-vimeo-v:before {
  content: "\f27d"; }

.fa-vine:before {
  content: "\f1ca"; }

.fa-virus:before {
  content: "\f974"; }

.fa-virus-slash:before {
  content: "\f975"; }

.fa-viruses:before {
  content: "\f976"; }

.fa-vk:before {
  content: "\f189"; }

.fa-vnv:before {
  content: "\f40b"; }

.fa-voicemail:before {
  content: "\f897"; }

.fa-volleyball-ball:before {
  content: "\f45f"; }

.fa-volume-down:before {
  content: "\f027"; }

.fa-volume-mute:before {
  content: "\f6a9"; }

.fa-volume-off:before {
  content: "\f026"; }

.fa-volume-up:before {
  content: "\f028"; }

.fa-vote-yea:before {
  content: "\f772"; }

.fa-vr-cardboard:before {
  content: "\f729"; }

.fa-vuejs:before {
  content: "\f41f"; }

.fa-walking:before {
  content: "\f554"; }

.fa-wallet:before {
  content: "\f555"; }

.fa-warehouse:before {
  content: "\f494"; }

.fa-water:before {
  content: "\f773"; }

.fa-wave-square:before {
  content: "\f83e"; }

.fa-waze:before {
  content: "\f83f"; }

.fa-weebly:before {
  content: "\f5cc"; }

.fa-weibo:before {
  content: "\f18a"; }

.fa-weight:before {
  content: "\f496"; }

.fa-weight-hanging:before {
  content: "\f5cd"; }

.fa-weixin:before {
  content: "\f1d7"; }

.fa-whatsapp:before {
  content: "\f232"; }

.fa-whatsapp-square:before {
  content: "\f40c"; }

.fa-wheelchair:before {
  content: "\f193"; }

.fa-whmcs:before {
  content: "\f40d"; }

.fa-wifi:before {
  content: "\f1eb"; }

.fa-wikipedia-w:before {
  content: "\f266"; }

.fa-wind:before {
  content: "\f72e"; }

.fa-window-close:before {
  content: "\f410"; }

.fa-window-maximize:before {
  content: "\f2d0"; }

.fa-window-minimize:before {
  content: "\f2d1"; }

.fa-window-restore:before {
  content: "\f2d2"; }

.fa-windows:before {
  content: "\f17a"; }

.fa-wine-bottle:before {
  content: "\f72f"; }

.fa-wine-glass:before {
  content: "\f4e3"; }

.fa-wine-glass-alt:before {
  content: "\f5ce"; }

.fa-wix:before {
  content: "\f5cf"; }

.fa-wizards-of-the-coast:before {
  content: "\f730"; }

.fa-wolf-pack-battalion:before {
  content: "\f514"; }

.fa-won-sign:before {
  content: "\f159"; }

.fa-wordpress:before {
  content: "\f19a"; }

.fa-wordpress-simple:before {
  content: "\f411"; }

.fa-wpbeginner:before {
  content: "\f297"; }

.fa-wpexplorer:before {
  content: "\f2de"; }

.fa-wpforms:before {
  content: "\f298"; }

.fa-wpressr:before {
  content: "\f3e4"; }

.fa-wrench:before {
  content: "\f0ad"; }

.fa-x-ray:before {
  content: "\f497"; }

.fa-xbox:before {
  content: "\f412"; }

.fa-xing:before {
  content: "\f168"; }

.fa-xing-square:before {
  content: "\f169"; }

.fa-y-combinator:before {
  content: "\f23b"; }

.fa-yahoo:before {
  content: "\f19e"; }

.fa-yammer:before {
  content: "\f840"; }

.fa-yandex:before {
  content: "\f413"; }

.fa-yandex-international:before {
  content: "\f414"; }

.fa-yarn:before {
  content: "\f7e3"; }

.fa-yelp:before {
  content: "\f1e9"; }

.fa-yen-sign:before {
  content: "\f157"; }

.fa-yin-yang:before {
  content: "\f6ad"; }

.fa-yoast:before {
  content: "\f2b1"; }

.fa-youtube:before {
  content: "\f167"; }

.fa-youtube-square:before {
  content: "\f431"; }

.fa-zhihu:before {
  content: "\f63f"; }

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

.sr-only-focusable:active, .sr-only-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("/static/web/fontawesome/webfonts/fa-brands-400.eot");
  src: url("/static/web/fontawesome/webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("/static/web/fontawesome/webfonts/fa-brands-400.woff2") format("woff2"), url("/static/web/fontawesome/webfonts/fa-brands-400.woff") format("woff"), url("/static/web/fontawesome/webfonts/fa-brands-400.ttf") format("truetype"), url("/static/web/fontawesome/webfonts/fa-brands-400.svg#fontawesome") format("svg"); }

.fab {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("/static/web/fontawesome/webfonts/fa-regular-400.eot");
  src: url("/static/web/fontawesome/webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("/static/web/fontawesome/webfonts/fa-regular-400.woff2") format("woff2"), url("/static/web/fontawesome/webfonts/fa-regular-400.woff") format("woff"), url("/static/web/fontawesome/webfonts/fa-regular-400.ttf") format("truetype"), url("/static/web/fontawesome/webfonts/fa-regular-400.svg#fontawesome") format("svg"); }

.far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url("/static/web/fontawesome/webfonts/fa-solid-900.eot");
  src: url("/static/web/fontawesome/webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("/static/web/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"), url("/static/web/fontawesome/webfonts/fa-solid-900.woff") format("woff"), url("/static/web/fontawesome/webfonts/fa-solid-900.ttf") format("truetype"), url("/static/web/fontawesome/webfonts/fa-solid-900.svg#fontawesome") format("svg"); }

.fa,
.fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }

.h-container {
  display: flex;
  flex-direction: row;
  overflow: hidden;
}

.v-container {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.grow {
  flex-grow: 1;
}

.column-2 {
  flex: 50%;
}

/*
  Put rules here that pertain to EVERY 100% screen view.
*/

/* Don't use this, it takes a long time to recompute styles for all the body elements */
/*body.wait * {
  cursor: wait !important;
}*/

body {
  height: 100vh;
  width: 100vw;
  margin: 0;
  color: var(--text-color);
  font-family: cairo;
  background: var(--background-dark);
}

strong, b {
  font-family: 'cairo-bold';
  font-weight: normal;
}

h3 {
  font-family: 'cairo-semibold';
  font-weight: normal;
}

a {
  color: var(--link-color);
  text-decoration: underline;
}

a:hover {
  color: var(--link-color-hover);
  cursor: pointer;
}

h1, h2, h3, h4, h5 {
  margin: 0;
}

input:not([type="range"]), select {
  margin-left: 3px;
  padding-top: 0;
  padding-left: 5px;
  padding-bottom: 0;
  padding-right: 5px;
  border-radius: 8px;
  font-family: 'cairo-semibold';
  font-size: 1em;
}

input:focus, select:focus {
  outline: none;
}

div::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
div {
  scrollbar-width: thin;
  scrollbar-color: #707070 var(--background-darker);
}
div::-webkit-scrollbar-track {
  background: var(--background-darker);
}
div::-webkit-scrollbar-thumb {
  background-color: #707070;
  border-radius: 6px;
  /*border: 1px solid var(--background-darker);*/
}

label.fileinput {
  cursor: pointer;
}
label.fileinput[disabled] {
  cursor: inherit;
}

label.fileinput input[type="file"] {
  display: none;
}

div.h-divider, div.v-divider {
  border-color: #fff6ec;
  border-radius: 0 25px 0 25px;
  opacity: .12;
  margin: 5px;
}
div.h-divider.thin {
  margin-top: 0;
  margin-bottom: 0;
}

div.labeldivider {
  min-height: 2em;
}
div.labeldivider .divider-right {
  width: 30px;
}

div.h-divider {
  margin-top: 15px;
  margin-bottom: 20px;
  border-bottom: 2px solid;
}

div.v-divider {
  margin-right: 15px;
  margin-left: 15px;
  border-right: 2px solid;
}

.textdivider > .h-divider {
  margin: auto 10px;
}
.textdivider > .h-divider:first-of-type {
  width: 10%;
}

.hide {
  display: none !important;
}

.currency {
  white-space: nowrap;
}
.currency .code {
  font-size: 76%;
  /*vertical-align: text-top;*/
}

.strikethrough {
    position: relative;
}
.strikethrough::before {
    content: '';
    border-bottom: 2px solid #555555;
    width: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: rotate(-4deg) translateY(-2px);
}

table tr,
table td {
  vertical-align: top;
}

table.verticaltable tr td:first-of-type {
  font-family: cairo-bold;
  text-align: right;
  vertical-align: top;
  padding-right: 10px;
  /*padding-left: 0;*/
}

table.verticaltable tr td {
  text-align: left;
  padding-left: 8px;
}

table th {
  font-family: cairo-bold;
  font-weight: normal;
}

table.striped {
  background-color: var(--background-darker);
  border-radius: 10px;
  overflow: hidden;
  border-collapse: collapse;
}

table.striped thead {
  background-color: var(--background-darker-row);
}
table.striped tr:nth-child(even) {
  background-color: var(--background-darker-row);
}

table.striped.verticaltable tr td:first-of-type {
  border-right: 1px solid var(--background-main);
}


table.striped:not(.verticaltable) {
  border-bottom: 1px solid var(--background-main);
}

table.rounded {
  --border-size: 7px;
  border-collapse: collapse;
}
table.rounded td {
  border-radius: 0;
  padding: 5px;
}
table.rounded td:first-child {
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  padding-left: calc(var(--border-size) + 10px);
}
table.rounded td:last-child {
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  padding-right: calc(var(--border-size) + 10px);
}
table.rounded td {
  border-top: var(--border-size) solid var(--background-dark);
  border-bottom: var(--border-size) solid var(--background-dark);
}

table td.tdtop {
  vertical-align: top;
}
table td.tdmiddle {
  vertical-align: middle;
}
table td.tdbottom {
  vertical-align: bottom;
}

table td.tdleft {
  text-align: left;
}
table td.tdcenter {
  text-align: center;
}
table td.tdright {
  text-align: right;
}



input[type=range] {
  --track-color: #54626f;
  --track-color-disabled: #4f5a63;
  --thumb-color-disabled: #414950;
  height: 23px;
  -webkit-appearance: none;
  margin: 10px 0;
  width: 100%;
  background: rgba(0, 0, 0, 0);
  pointer-events: none;
}
input[type=range][disabled] {
  --track-color: var(--track-color-disabled);
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
  background: var(--track-color);
  border-radius: 50px;
  border: 0px solid #000000;
}
input[type=range]::-moz-range-thumb {
  pointer-events: auto;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--range_slider_thumb_color);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -6px;
  pointer-events: auto;
}
input[type=range][disabled]::-webkit-slider-thumb {
  background: var(--thumb-color-disabled);
  cursor: default;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: var(--track-color);
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
  background: var(--track-color);
  border-radius: 50px;
  border: 0px solid #000000;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--range_slider_thumb_color);
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: var(--track-color);
  border: 0px solid #000000;
  border-radius: 100px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
}
input[type=range]::-ms-fill-upper {
  background: var(--track-color);
  border: 0px solid #000000;
  border-radius: 100px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
}
input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 50px;
  background: var(--range_slider_thumb_color);
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: var(--track-color);
}
input[type=range]:focus::-ms-fill-upper {
  background: var(--track-color);
}

.busyscreen {
  z-index: 9999999;
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, .5);
  display: none;
}

.spandesktopdisplay {
  display: inline-block;
}

.mobiledisplay {
  display: none;
}


@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 var(--pulse-color);
  }

  3% {
    box-shadow: 0 0 0 1px var(--pulse-color);
  }

  70% {
    box-shadow: 0 0 0 8px rgba(0, 0, 0, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}


/* Tablet */
@media only screen and (max-width: 900px) {
  div::-webkit-scrollbar {
    width: 4px;
    height: 4px;
  }

  .spandesktopdisplay {
    display: none !important;
  }

  .desktopdisplay {
    display: none !important;
  }

  .mobiledisplay {
    display: inherit !important;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  div::-webkit-scrollbar {
    width: 2px;
    height: 2px;
  }
}

@font-face {
  font-family: cairo;
  src: url(/static/web/font/Cairo/Cairo-Regular.ttf);
}

@font-face {
  font-family: cairo-bold;
  src: url(/static/web/font/Cairo/Cairo-Bold.ttf);
}

@font-face {
  font-family: cairo-semibold;
  src: url(/static/web/font/Cairo/Cairo-SemiBold.ttf);
}


@font-face {
  font-family: dmmono;
  src: url(/static/web/font/DMMono/DMMono-Regular.ttf);
}

@font-face {
  font-family: dmmono-italic;
  src: url(/static/web/font/DMMono/DMMono-Italic.ttf);
}

@font-face {
  font-family: dmmono-light;
  src: url(/static/web/font/DMMono/DMMono-Light.ttf);
}

@font-face {
  font-family: dmmono-lightitalic;
  src: url(/static/web/font/DMMono/DMMono-LightItalic.ttf);
}

@font-face {
  font-family: dmmono-medium;
  src: url(/static/web/font/DMMono/DMMono-Medium.ttf);
}

@font-face {
  font-family: dmmono-mediumitalic;
  src: url(/static/web/font/DMMono/DMMono-MediumItalic.ttf);
}

:root {
  --background-main: #3e3b38;
  --background-dark: #292725;
  --background-dark-semi-trans: #2927257d;
  --background-just-a-bit-darker: #1c1a19;
  --background-darker: #141313;
  --background-darker-row: #1c1a19;
  --background-light: #4c4e53;
  --background-hover: #1f1d1c;
  --background-light-gray: #5f5e5c;
  --background-maroon: #511b35;
  --background-teal: #0099b3;
  --background-blender-orange: #ea7600;
  --background-blender-orange-disabled: #ea7600;
  --foreground-main: #eeeeee;

  --link-color: #ffe279;
  --link-color-hover: #ffefb3;

  --text-color: #d8d8d8;
  --text-color-light: #f0f0f0;
  --text-color-hover: white;
  --text-color-darker: #c2c2c2;
  --text-color-dark: #a2a2a2;
  --text-color-disabled: #797979;
  --text-color-success: #7dff00;
  --text-color-warning: #fff300;
  --text-color-error: #ff4242;
  --text-color-danger: #c90000;
  --text-color-darkred: #b40000;
  --text-color-highlight: #d6e8ff;
  --text-color-teal: #00b7d6;
  --text-color-teal-light: #25d3f1;
  --text-color-brownish: #bcae9f;
  --text-color-brownish-light: #ddceac;
  --unlocked-color: #6aa8c4;

  --glow-color: #ff0044;
  --glow-color-dark: #b3002f;
  --glow-color-darker: #940128;

  --button-disabled: #585a60;
  --button-disabled-text: #a1a1a1;
  --button-gray: #53555b;
  --button-danger: #880000;
  --button-primary: #0a6e58; /* #512384; */
  --button-primary-hover: #17977B;
  --button-primary-disabled: #224c42;
  --button-lightblue: #16578f; /* #512384; */

  --mobiletooltip-color:
  var(--text-color);

  --ocean-green: #25efc3;

  --dropdown-color: #3e3b38;

  --range_slider_thumb_color: #7cb1de;

  --text-color-aquamarine: #00e8b5;
}

.text-warning {
  color: var(--text-color-warning) !important;
}

.text-success {
  color: var(--text-color-success) !important;
}

.text-error {
  color: var(--text-color-error) !important;
  text-shadow: 1px 1px rgba(0, 0, 0, 0.75);
}

.text-highlight {
  color: var(--text-color-teal-light) !important;
}

.text-darker {
  color: var(--text-color-darker) !important;
}

.button-danger {
  background: var(--button-danger);
}

.notification {
  display: none;
  position: fixed;
  top: 45px;
  left: 50%;
  max-width: 700px;
  transform: translateX(-50%);
  text-align: center;
  /*font-family: 'cairo-semibold';*/
  font-size: 110%;
  color: white;
  z-index: 99999;
  background: rgba(50, 49, 46, .85);
  /*text-shadow: 2px 2px 2px black;*/
  padding: 7px 30px;
  border-radius: 5px;
  pointer-events: none;
  line-height: 1.3;
  backdrop-filter: blur(1.5px);
}

.notification a {
  pointer-events: auto;
}

.notification.success {
  border: 1px green solid;
}
.notification.warning {
  border: 1px var(--text-color-warning) solid;
}
.notification.error {
  border: 1px var(--text-color-error) solid;
}

.notification .notification-x {
  color: #aaaaaa;
  font-size: 140%;
  right: 0;
  position: absolute;
  pointer-events: auto;
  cursor: pointer;
  transform: translate(-2px, -17px);

  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  user-select: none;
  -webkit-user-select: none;
}
.notification .notification-x:hover {
  color: #eeeeee;
}

.navbar {
  --navbar-color: var(--background-darker);
  --navbar-height: 40px;
  --navbar-hover-color: #565656;
  --border-thickness: 3px;
  height: var(--navbar-height);
  background: var(--navbar-color);
  /*background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.8)), url("/static/site/img/sparklesbanner.jpg");*/
  /*background-position: center;*/
  font-family: cairo-semibold;
  overflow: inherit;
  /*transform: translateY(calc(-1 * var(--border-thickness)));*/
}

.navbar .navbarlinks {
  overflow: visible;
}

.navbar .navlink {
  margin-left: 8px;
  margin-right: 3px;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
  color: var(--text-color);
  user-select: none; /* standard syntax */
  -webkit-user-select: none; /* webkit (safari, chrome) browsers */
  -moz-user-select: none; /* mozilla browsers */
  -khtml-user-select: none; /* webkit (konqueror) browsers */
  -ms-user-select: none; /* IE10+ */
  white-space: nowrap;
}

.navbar .navlink.active {
  border-bottom: 2px solid var(--glow-color-dark);
  background: linear-gradient(
    to top, 
    var(--glow-color-dark) -50%,
    rgba(0, 0, 0, 0) 90%
  );
  pointer-events: none;
}

.navbar .navlink:not(.active):hover,
.navbar .navlink:not(.active):focus {
  background: linear-gradient(
    to top, 
    var(--navbar-hover-color) -50%,
    rgba(0, 0, 0, 0) 90%
  );
}

.navbar a,
.navbar div.dropdown {
  font-family: cairo-semibold;
  /*margin: 3px 8px 0 8px;*/
  color: var(--text-color);
  text-decoration: none;
  display: block;
  white-space: nowrap;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
.navbar a {
  margin: 3px 8px 0 8px;
}


.navbar .navlink.active a:first-of-type,
.navbar .navlink:hover > a,
.navbar .navlink:focus > a,
.navbar .dropdown-button:hover > a,
.navbar .dropdown.active .dropdown-button {
  color: white;
}

.navbar .dropdown.active {
  background-color: var(--dropdown-color);
}

.navbarline {
  width: 100%;
  height: 0px;
  border-width: 1.5px;
  border-style: solid;
  border-image: 
    linear-gradient(
      to right, 
      var(--glow-color), 
      rgba(0, 0, 0, 0)
    ) 100% 2;
}

.navbar .dropdown-title {
  display: inline-block;
  /*margin-left: 0;*/
}

.navbar .fa {
  margin-right:1px;
  padding-left: 6px;
  text-decoration: none;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
  transform: translateY(1px);
}

.setlanguage .dropdown-title {
  margin: 3px 8px 0 0;
}

/* New mobile style stuff */

.hamburger .fa {
  margin: 0;
  padding-left: 8px;
  padding-right: 8px;
}

.navbarmobile {
  display: none;
}

.navbarmobile .dropdown {
  z-index: 1010;
}

.navbarmobile .dropdown-items {
  max-height: 85vh;
  overflow-y: auto;
}

.navbarmobile.hamburger .dropdown {
  height: 100%;
}

.navbarmobile.hamburger .dropdown .dropdown-button {
  height: 100%;
  width: 35px;
}

.navbarmobile.hamburger .dropdown .dropdown-button i {
  vertical-align: middle;
}

.navbar i {
  text-align:center;
  /* If you want to center vertically */
  /*vertical-align: middle;*/
  transition: color 0.3s;
}

.navbar i:hover {
    color: white;
}

.navbar i.fa {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
}

@media only screen and (max-width: 600px) {
  .navbardesktop {
    display: none;
  }

  .navbarmobile {
    display: block;
  }
/*
  .navbarline {
    border-width: 2px;
  }*/

}
.glow {
  /*font-size: 80px;*/
  color: #fff !important;
  text-align: center;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: glow 1s ease-in-out infinite alternate;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}
button,
.btn,
input[type=submit],
label.fileinput {
  color: white;
  background: var(--button-gray);
  border: none;
  padding-left: 1em;
  padding-right: 1em;
  border-radius: 5px;
  margin: 3px;
  cursor: pointer;
  font-family: cairo;
  font-size: 100%;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

a.btn {
  text-align: center;
  box-sizing: border-box;
  text-decoration: none;
}
a.btn:not(:disabled):hover {
  color: inherit;
}

button:not(:disabled):hover,
button:not(:disabled).hover,
.btn:not(:disabled):hover,
.btn:not(:disabled).hover,
input[type=submit]:not(:disabled):hover,
input[type=submit]:not(:disabled).hover,
label.fileinput:not(:disabled):hover,
label.fileinput:not(:disabled).hover {
  filter: brightness(85%);
}

button:focus,
.btn:focus,
input[type=submit]:focus,
label.fileinput:focus {
  outline: none !important;
}

button:active,
.btn:active,
input[type=submit]:active,
label.fileinput:active {
  outline: none !important;
}

button[disabled],
.btn[disabled],
input[type=submit][disabled],
label.fileinput[disabled] {
  background: var(--button-disabled);
  color: var(--button-disabled-text);
  cursor: inherit;
}

button.primary,
.btn.primary,
input[type=submit].primary,
label.fileinput.primary {
  background: var(--button-primary);
  color: white;
}

button.primary[disabled],
.btn.primary[disabled],
input.primary[type=submit][disabled],
label.primary.fileinput[disabled] {
  background: var(--button-primary-disabled);
  color: var(--button-disabled-text);
}

button.danger,
.btn.danger,
input[type=submit].danger,
label.fileinput.danger {
  background: var(--button-danger);
}

button.lightblue,
.btn.lightblue,
input[type=submit].lightblue,
label.fileinput.lightblue {
  background: var(--button-lightblue);
  color: white;
}

.radio button {
  border: 2px solid rgba(0, 0, 0, 0);
}

.radio button.active {
  border-color: var(--link-color);
}

@media only screen and (max-width: 900px) {
  button:not(:disabled):hover,
  .btn:not(:disabled):hover,
  input[type=submit]:not(:disabled):hover,
  label.fileinput:not(:disabled):hover {
    filter: inherit;
  }
}

.tabs {
  overflow: hidden;
  flex-shrink: 0;
  margin: 0px;
}

.tabs button {
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  background: inherit;
  font-family: cairo-semibold;
  margin: 0;
  border-radius: 5px 5px 0 0;
  padding: 5px 10px;
}

.tabs button + button {
  margin-left: 5px;
}

.tabs button.active,
.tabs button.hover,
.tabs button.focus {
  background: var(--background-main);
  filter: none;
}

.tabpanel {
  padding: 6px 12px;
  border-top: none;
  background: var(--background-main);
  border-radius: 0 10px 10px 10px;
}

.tabpanel.hide {
  display: none;
}


.scrolltabs {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overflow-y: auto;
  text-align: right;
  border-right: 2px #504d4b solid;
  margin-right: 0;
  padding-right: 7px;
}

.scrolltabpanel {
  /*flex-grow: 1;*/
}

.scrolltabs a {
  text-decoration: none;
  color: var(--text-color);
  font-family: "cairo-semibold";
  font-size: .9em;

  webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.scrolltabs a:hover,
.scrolltabs a.active {
  color: var(--text-color-hover);
  text-decoration: underline;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  .tabpanel {
    padding: 6px 4px;
    max-width: 100%;
  }
}

/* Phone */
@media only screen and (max-width: 560px) {
  .tabpanel {
    padding: 6px 4px;
    max-width: 100%;
  }
}
.helpcircle {
  margin-left: 2px;
  color: rgba(136, 169, 175, 0.5);
  font-size: 14px;
}
.helptip {
  text-align: left;
  line-height: 1.2;
  max-width: 450px;
  min-width: 250px;
  padding: 0 6px;
}
.helptip .title {
  color: #76cedd;
  font-style: italic;
  font-size: 14px;
  text-align: left;
  margin: 8px 0 0 0;
}
.helptip p {
  margin: 12px 0;
}
.helptext {
  display: block;
  font-size: small;
  color: var(--text-color-darker);
}
.helptext ul {
  margin: 0;
}

.fielditem {
  padding: 4px;
  margin: 4px 2px 2px 2px;
}

.checkboxbtn {
  cursor: pointer;
  user-select: none;
}
.checkboxbtn[disabled] {
  cursor: inherit;
}

.checkboxbtn input[type="checkbox"] {
  pointer-events: none;
}

.showhiddenpanelbtn {
  font-size: small;
  text-decoration: underline;
}

.showhiddenpanel .arrow {
  text-decoration: none;
  color: inherit;
  margin-right: 5px;
}

.showhiddenpanel.show .arrow {
  transform: rotate(90deg);
}

.hiddenpanel {
  display: none;
}

.hiddenpanel.show {
  display: inherit;
}

.hiddenpanel-collapse {
  margin-left: 8px;
}
/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  justify-content: center;
  align-items: center;
  position: fixed;  /*Stay in place*/
  z-index: 2000; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: none; /* auto; */
  background: rgb(0,0,0); /* Fallback color */
  background: rgba(0,0,0,0.4); /* Black w/ opacity */
  pointer-events: auto;
  backdrop-filter: blur(1.5px);
}

/* Modal Content/Box */
.modal-content {
  display: flex;
  flex-direction: column;
  background: var(--background-main);
  width: 80%; /* Could be more or less, depending on screen size */
  max-width: 1200px;
  max-height: 95vh;
  overflow-y: none;
  /*position: relative;*/
  padding: 0;
  color: var(--foreground-main);
  box-shadow: 0 4px 6px 0 rgba(0,0,0,0.3),0 6px 20px 0 rgba(0,0,0,0.3);
  border-radius: .3rem;
  animation-name: modalfadein;
  animation-duration: 0.4s
}

.modal.modal-small .modal-content {
  width: 100vw;
  max-width: 500px;
}

.modal.modal-medium .modal-content {
  max-width: 700px;
}

/* Modal Header */
.modal-header {
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 2px 16px;
  font-family: cairo-bold;
  background: var(--background-dark);
  border-top-right-radius: .3rem;
  border-top-left-radius: .3rem;
}

/* Modal Body */
.modal-body {
  overflow-y: auto;
  position: relative;
  padding: 20px;
}

/* Modal Footer */
.modal-footer {
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom-right-radius: .3rem;
  border-bottom-left-radius: .3rem;
  flex-shrink: 0;
}

/* The Close Button */
.modal-x-btn {
  position: absolute;
  right: 8px;
  font-size: 28px;
  font-weight: bold;
  top: -14px;
  color: #eeeeee50;

  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.modal-x-btn:hover,
.modal-x-btn:focus {
  text-decoration: none;
  cursor: pointer;
  color: #eeeeee;
}

/* Add Animation */
@keyframes modalfadein {
  from {opacity: 0}
  to {opacity: 1}
}

.modal-cancel {
  cursor: pointer;
}

@media only screen and (max-width: 600px) {
  .modal-content {
    width: 100%; /* Could be more or less, depending on screen size */
    max-height: 90vh; /* Could be more or less, depending on screen size */
  }

  .modal-body {
    padding: 10px;
    max-height: 70vh;
  }

}

@media only screen and (max-height: 700px) {
  .modal-content {
    max-height: 100vh; /* Could be more or less, depending on screen size */
  }

  .modal-body {
    max-height: 80vh;
  }

  .modal-footer {
    padding: 4px 16px;
  }
}

@media only screen and (max-height: 360px) {
  .modal-body {
    max-height: 60vh;
  }
}
.buttongroup button.active {
  color: white;
  background: var(--background-dark);
}

.buttongroup button:first {
  font-size: 1.5em;
}

.buttongroup button {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: 0;
  margin-left: 0;
}

.buttongroup button:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  padding-left: 20px;
}

.buttongroup button:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  padding-right: 20px;
}

.buttongroup button * {
  pointer-events: none !important;
}

.dropdown {
  position: relative;
  z-index: 1002;
}

.dropdown-button {
  cursor: pointer;
  display: inline-block;
  color: var(--text-color);
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}

.dropdown-button:hover,
.dropdown.active .dropdown-button {
  color: white;
}


.dropdown.up .dropdown-items {
  bottom: 3em;
}

.dropdown-items > * {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dropdown-items > a > .fa,
.dropdown-items > span > .fa {
  margin-right: 5px;
}
.dropdown-items [data-icon] {
  transform: translateX(-3px);
}

.dropdown-items {
  white-space: nowrap;
  display: none;
  position: absolute;
  background-color: var(--dropdown-color);
  color: var(--text-color);
  box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.5);
  margin-right: 3px;
  text-align: center;
  border-radius: 4px;
}


.dropdown-items a, .dropdown-items .item {
  font-family: 'cairo';
  margin: 0;
  padding: 5px 30px;
  color: var(--text-color);
  text-decoration: none;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
  line-height: 1.7;
}
.dropdown-items a, .dropdown-items .item:not(.mobiledisplay) {
  display: block;
  text-align: left;
  border-top: 1px solid var(--background-dark);
}

.dropdown-items a[disabled], .dropdown-items .item[disabled] {
  color: var(--text-color-disabled);
  cursor: default;
  pointer-events: none;
}

.dropdown-items a:not([disabled]):hover,
.dropdown-items .item:not([disabled]):hover {
  background-color: var(--background-just-a-bit-darker);
  color: white;
}



#dropdowncontainer {
  position: fixed;
  left: 50%;
  /* top: 50%; */
  background: var(--dropdown-color);
  z-index: 1000;
  box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.5);
  margin-right: 3px;
  text-align: center;
  z-index: 10000;
}
#dropdowncontainer .dropdown-items {
  display: block;
}

.dropdown-items > .header {
  font-size: small;
  color: var(--text-color-dark);
  font-family: 'cairo-semibold';
  background: var(--background-dark);
  border-bottom: 1px solid var(--background-darker);
  font-style: italic;
  text-align: center;
}


.dropdown-items.show {
  display: block;
}

.dropdown-items .h-divider {
  margin: 0 0;
  color: var(--background-dark);
  opacity: 1;
  border-width: 3px;
  border-radius: 0;
}

.imginput {
  height: 120px;
  width: 120px;
  border-radius: 10px;
  position: relative;
  background-color: rgba(255, 255, 255, 0.06);
}

.imginput:not([disabled]) {
  cursor: pointer;
}

.imginput:hover {
	background-color: rgba(255, 255, 255, 0.08);
}

.imginput input[type='file'] {
	display: none;
}

.imginput img {
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}

.imginput img[src] {
	display: block;
}

.imginput .fa {
	position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
}


.i-background {
  fill: rgba(0, 0, 0, 0);
}

.i-foreground {
  fill: var(--text-color);
}

[data-icon] {
  text-decoration: none;
  height: 1.4em;
  width: auto;
  display: inline-block;
}

[data-icon] svg {
  vertical-align: sub;
  width: 2em;
  width: 100%;
  height: 100%;
}

.inputmodal .modal-content {
  text-align: center;
  max-width: 500px;
}

.inputmodal .modal-body p {
  pointer-events: auto;
  -webkit-user-select: auto; /* Safari */        
  -moz-user-select: auto; /* Firefox */
  -ms-user-select: auto; /* IE10+/Edge */
  user-select: auto; /* Standard */
}

.inputmodal {
	/*align-items: start;*/
	/*padding-top: 10%;*/
}

.okmodal .modal-body p {
  pointer-events: auto;
  -webkit-user-select: auto; /* Safari */        
  -moz-user-select: auto; /* Firefox */
  -ms-user-select: auto; /* IE10+/Edge */
  user-select: auto; /* Standard */
}

.tooltip,
.tooltip-top {
  --tooltip-color: pink;
  text-align: center;
  border-radius: 7px;
  padding: 5px 10px;
  position: fixed;
  z-index: 999999;
  transform: translate(-50%, -100%);
  color: white;
  background: var(--tooltip-color);
  white-space: nowrap;
}
.tooltip-right {
  transform: translate(0, -50%);
}
.tooltip-bottom {
  transform: translate(-50%, 0);
}
.tooltip-left {
  transform: translate(-100%, -50%);
}
.tooltip:not(.tooltip-hover) {
  pointer-events: none;
}

.tooltip.default {
  --tooltip-color: rgba(8, 8, 8);
}

.tooltip::after {
  content: '';
  position: absolute;
  border-width: 6px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0);
  pointer-events: none;
}
.tooltip-top::after {
  border-color: var(--tooltip-color) transparent transparent transparent;
  /*margin-left: -5px;*/
  top: calc(100% - 1px);
  left: 50%;
}
.tooltip-right::after {
  border-color: transparent var(--tooltip-color) transparent transparent;
  margin-top: -5px;
  top: 50%;
  right: calc(100% - 1px);
}
.tooltip-left::after {
  border-color: transparent transparent transparent var(--tooltip-color);
  margin-top: -5px;
  top: 50%;
  left: calc(100% - 1px);
}
.tooltip-bottom::after {
  border-color: transparent transparent var(--tooltip-color) transparent;
  bottom: calc(100% - 1px);
  left: 50%;
}

.mobiletooltipbtn {
  pointer-events: all;
  z-index: 100;
  position: absolute;
  font-size: 15px;
  text-shadow: 2px 2px 2px black;
  /*left: 0px;*/
  /*top: 0px;*/
  padding: 10px;
  background: rgba(0, 0, 0, 0.3);
  color: var(--mobiletooltip-color);
  opacity: 0.7;
  display: none;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  .mobiletooltipbtn {
    display: block;
  }

  .tooltip:not(.tooltip-hover) {
    pointer-events: all;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .tooltip {
    max-width: 70%;
  }
}

.rangecategorywidget {
  width: 250px;
  pointer-events: auto;
  height: 25px;
  margin: 10px;
}

.rangecategorywidget .barcontainer {
  margin-top: auto;
  display: inline-block;
  width: 100%;
  height: 3px;
  background: pink;
  border-bottom: 2px solid black;
  position: relative;

  -webkit-transition: left 0.3s ease;
  transition: left 0.3s ease;
}

.rangecategorywidget .barcontainer .bar {
  position: absolute;
  background: 'purple';
  height: 4px;
  bottom: 0;
  left: 0;
}

.rangecategorywidget .barcontainer .marker {
  position: absolute;
  height: 5px;
  width: 5px;
  background: white;
  bottom: 2px;
  transform: translateX(-50%);
}

.loadingspinner {
  --dimension: 10px;
  --text-color: rgba(255, 255, 255, 0.75);
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  /* background: green; */
  display: block;
  width: fit-content;
  /*position: absolute;
  left: 50%;
  top: 50%;*/
  z-index: 999999999;
}

/* Transparent Overlay */
.loadingspinner:before {
  content: '';
  display: block;
  /*position: fixed;
  top: 0;
  left: 0;*/
  width: 100%;
  height: 100%;
  /*background-color: rgba(0,0,0,0.3);*/
}

/* :not(:required) hides these rules from IE9 and below */
.loadingspinner:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.loadingspinner:not(:required):after {
  content: '';
  display: block;
  font-size: var(--dimension);
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  margin-left: auto;
  margin-right: auto;
  -webkit-animation: spinner 2000ms infinite linear;
  -moz-animation: spinner 2000ms infinite linear;
  -ms-animation: spinner 2000ms infinite linear;
  -o-animation: spinner 2000ms infinite linear;
  animation: spinner 2000ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: var(--text-color) 1.5em 0 0 0, var(--text-color) 1.1em 1.1em 0 0, var(--text-color) 0 1.5em 0 0, var(--text-color) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.5) -1.5em 0 0 0, rgba(255, 255, 255, 0.5) -1.1em -1.1em 0 0, var(--text-color) 0 -1.5em 0 0, var(--text-color) 1.1em -1.1em 0 0;
  box-shadow: var(--text-color) 1.5em 0 0 0, var(--text-color) 1.1em 1.1em 0 0, var(--text-color) 0 1.5em 0 0, var(--text-color) -1.1em 1.1em 0 0, var(--text-color) -1.5em 0 0 0, var(--text-color) -1.1em -1.1em 0 0, var(--text-color) 0 -1.5em 0 0, var(--text-color) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.selectfilebtn {
  cursor: pointer;
}

form.embeddedform:not(.editing) .editmode,
.embeddedform form:not(.editing) .editmode {
  display: none;
}
form.embeddedform.editing .infomode,
.embeddedform form.editing .infomode {
  display: none;
}

form.embeddedform.editing .value,
.embeddedform form.editing .value {
  display: none;
}

form.embeddedform.editing .editbtn,
.embeddedform form.editing .editbtn {
  display: none;
}
.embeddedform form:not(.editing) .deletebtn,
form.embeddedform:not(.editing) .deletebtn,
.embeddedform form:not(.editing) .cancelbtn,
form.embeddedform:not(.editing) .cancelbtn,
.embeddedform form:not(.editing) .savebtn,
form.embeddedform:not(.editing) .savebtn {
  display: none;
}

form.embeddedform .label,
.embeddedform form .label {
  color: var(--text-color);
}
form.embeddedform .value,
.embeddedform form .value {
  font-family: 'cairo-semibold';
  color: var(--text-color-teal);
}

form.embeddedform .thumbnail,
.embeddedform form .thumbnail {
  max-width: 100%;
  display: inline-block;
}
form.embeddedform .thumbnail > img,
.embeddedform form .thumbnail > img {
  width: 100%;
  background: var(--background-main);
  padding: 4px;
  border-radius: 10px;
  box-sizing: border-box;
  display: block;
}

form.embeddedform.editing .thumbnail:hover,
.embeddedform.editing form .thumbnail:hover {
  filter: brightness(115%);
}

form.embeddedform.editing .selectfilebutton,
.embeddedform.editing form .selectfilebutton {
  white-space: nowrap;
}

form.embeddedform .empty,
.embeddedform form .empty {
  color: var(--text-color-dark);
}

form.embeddedform .loadembeddedform {
  cursor: pointer;
}

.navbar .titancraftlogo {
  width: 210px;
  height: 100%;
  margin-left: 28px;
  display: block;
  margin-right: 12px;
  overflow: visible;
}

.navbar .dropdown-buttom {
  display: relative;
}

.navbar .titancraftlogo img {
  position: absolute;
  top: 0;
  z-index: 30;
  /*display: none;*/
}

.navbar .titancraftlogo .background {
  background: blue;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  position: absolute;
  z-index: 29;
  transform: translate(-4px, -7px) rotate(118deg);
  background: var(--navbar-color);
  /*outline: 2px solid var(--glow-color);*/
  border: 2px solid var(--glow-color);
  box-sizing: border-box;

  /*background: hsla(180, 100%, 50%, .5);*/
  mask: 
    conic-gradient(red 34%, transparent 0%) border-box
}

.textbanner {
  background: #ffcd00;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(40%, 75%) rotate(-10deg);
  border-radius: 2px;
  color: black;
  padding: 0 4px;
  font-family:
  'cairo-bold';
  font-size: 12px;
  line-height: 1;
  display: block;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 900px) {
  .navbar .titancraftlogo {
    width: 65px;
    margin-left: 8px;
    margin-right: 0;
  }
  .navbar .titancraftlogo img {
    width: 42px;
  }
  .navbarmobile .dropdown-items > * {
    position: relative;
    width: fit-content;
    margin: auto;
  }
}

@media only screen and (max-width: 600px) {
  .navbar .titancraftlogo {
    pointer-events: none;
    width: 25px;
  }
  .navbar .titancraftlogo img {
    top: -1px;
    position: fixed;
    transform: translateX(-50%);
    left: 50%;
    width: 44px;
    z-index: 30;
  }
}

:root {
  --right-panel-width: 30%;
}

#sizinggridcontainer {
  --sizing-background-color: #19191e;
  --horizontal-padding: 30px;
  position: absolute;
  top: 0;
  left: var(--horizontal-padding);
  width: calc(100% - 2 * var(--horizontal-padding));
  overflow-y: visible;
  /*min-height: 11px;*/
  /*background: rgba(255, 0, 0, 0.2);*/
  /*pointer-events: none;*/
}
#sizingbackground {
  --sizing-background-color: #19191e;
  position: absolute;
  z-index: 8;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: var(--sizing-background-color);
  pointer-events: none;
}

.sizinggrid {
  z-index: 9;
  position: relative;
}

.sizinggrid .horizontalline {
  --line-color: #777777;
  position: absolute;
  width: 100%;
  transform: translateY(-1px);
}
.sizinggrid .horizontalline .line {
  background: linear-gradient(to right, transparent, var(--line-color) 5%, var(--line-color) 95%, transparent);
  height: 1px;
}
.sizinggrid .horizontalline .label {
  position: absolute;
  top: 0;
  transform: translate(-50%, -50%);
  left: 20%;
  background: var(--sizing-background-color);
  padding: 0 12px;
  line-height: 1;
  font-size: x-large;
}
.sizinggrid .horizontalline .unit {
  font-size: 65%;
}

.sizinggrid .horizontalline[data-strength="strong"] .line {
  height: 2px;
  /*background: white;*/
}
.sizinggrid .horizontalline[data-strength="strong"] .label {
  color: var(--text-color);
  font-family: 'cairo-semibold';
}
.sizinggrid .horizontalline[data-strength="medium"] .line {
}
.sizinggrid .horizontalline[data-strength="medium"] .label {
  color: var(--text-color-dark);
}
.sizinggrid .horizontalline[data-strength="weak"] .line {
  border-bottom: 1px dashed white;
  transform: translateY(-1px);
  background: transparent;
  opacity: 0.15;
}
.sizinggrid .horizontalline[data-strength="weak"] .label {
  display: none;
}
.sizinggrid .horizontalline[data-strength="hide"] {
  display: none;
}
#sizinggridcontainer span[name="gridhandle"] {
  z-index: 11;
  position: absolute;
  top: 16px;
  transform: translate(-50%, -50%) scaleX(400%);
  left: 50%;
  background: #19191e90;
  padding: 4px 4px;
  line-height: 1;
  cursor: row-resize;
}
#sizinggridcontainer span[name="gridhandle"]:hover {
  color: var(--link-color-hover);
  /*background: var(--background-darker);*/
}

/*.characterthumbnail {
  display: none;
}

.characterthumbnail:first-of-type {
  display: inherit;
}

#addtocartbtn {
  display: none !important;
}*/

body {
  background: black;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#editor {
  position: relative;
}

#racepresetsmodal: {
  pointer-events: auto;
}

#racepresetsmodal .thumbnailbutton {
  background: var(--background-dark);
  cursor: pointer;
  display: inline-block;
  border-radius: 10px;

  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  margin: 5px;
}

#racepresetsmodal .thumbnailbutton:hover {
  background: var(--background-darker);
}

#alert {
  position: fixed;
  width: 100%;
  margin: 10px 10px;*/
  line-height: 125%;
  font-weight: bold;
  text-align: center;
  height: 0; /* the text still shows up when this is 0?*/
  z-index: 100;
  display: none;
}

.alert-success {
  color: var(--text-color-success);
}

.alert-warning {
  color: var(--text-color-error);
}

#volumelabel {
  position: fixed;
  bottom: 20px;
  left: 30%;
  color: yellow;
  z-index: 200;
  display: none;
  background: black;
  padding: 0 10px 0 10px;
}

.notification {
  /*left: calc((100% - var(--right-panel-width)) / 2);*/
}

#loadingscreen, #busyscreen {
  text-align: center;
  background: black;
  z-index: 22;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
}

#loadingscreen .loadingmessage, 
#busyscreen .loadingmessage {
  color: #c1c1c1;
  font-size: 22px;
  /*position: absolute;*/
  /*top: calc(50% - .7em);*/
  /*left: 50%;*/
  /*transform: translate(-50%, -100%);*/
  text-transform: uppercase;
}

#loadingscreen .loadingscreencontent, 
#busyscreen .loadingscreencontent {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#loadingscreen img {
  -webkit-transition: all 2s ease;
  transition: all 2s ease;
  -webkit-animation: slowfade 5s normal;
  -moz-animation: slowfade 5s normal;
  -o-animation: slowfade 5s normal;
  animation: slowfade 5s normal;
}
@keyframes slowfade {
  0%   { opacity: 0; }
  100%  { opacity: 1; }
}
@-o-keyframes slowfade{
  0%   { opacity: 0; }
  100%  { opacity: 1; }
}
@-moz-keyframes slowfade{
  0%   { opacity: 0; }
  100%  { opacity: 1; }
}
@-webkit-keyframes slowfade{
  0%   { opacity: 0; }
  100%  { opacity: 1; }
}


#busyscreen {
  background: rgba(0, 0, 0, .5);
  display: none;
}

#canvas {
  /*filter: contrast(1.1) brightness(1) saturate(110%);*/
  /*filter: contrast(1.05);*/
  /*display: none;*/
  background: transparent;
  outline: 3px solid black;
}

#leftside {
  position: relative;
  outline: green;
  background: black;
  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

#emptyscenemessage {
  z-index: 11;
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 35%;
  font-size: large;
  /*animation: hoverupdown 3s ease-in-out infinite;*/
  text-align:  center;
  color: var(--text-color);
  padding: 0 20px 2px 20px;
  background: rgb(0 0 0 / 50%);
  border-radius: 8px;
  --pulse-color: rgba(242, 214, 115, 0.5);
  animation: pulse 2s infinite;
}
#emptyscenemessage a {
 white-space: nowrap
}

#middlebuttons {
  z-index: 11;
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: 20px;
  text-align: center;
}

#sizinghelpersettings {
  text-align:  center;
  color: var(--text-color-darker);
  padding: 0 20px;
  background: rgba(41, 39, 37, 0.78);
  border-radius: 8px;
  border: 1px solid rgba(242, 214, 115, 0.25);
}

#sizinghelpersettings .checkboxbtn,
#sizinghelpersettings .referenceobjectsdropdown .dropdown-button {
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  gap: 8px;
}

#sizinghelpersettings .sizeoptions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

#sizinghelpersettings .sizeoptions > span {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 1;
}

#sizinghelpersettings > div {
  justify-content: center;
}

#sizinghelpersettings .modelscalediv {
  margin-left: 12px;
}


#sizinghelpersettings input[type="number"] {
  width: 40px;
}

/* Disable number input stepper arrows */
#sizinghelpersettings input[type="number"]::-webkit-outer-spin-button,
#sizinghelpersettings input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#sizinghelpersettings input[type="number"] {
  -moz-appearance: textfield;
}
#sizinghelpersettings button {
  color: white;
  display: block;
}
#sizinghelpersettings button[name="orthographicmode"] .fa {
  /*font-size: x-large;*/
  /*transform: translate(-4px, 2px) rotate(-60deg);*/
}
#sizinghelpersettings .field {
  margin: 8px;
}
#sizinghelpersettings button[name="orthographicmode"].active {
  /*background: #336c9e;*/
}


#centerviewbtn {
  opacity: 0;
  color: var(--text-color-darker);
  padding: 0 20px 2px 20px;
  background: rgb(0 0 0 / 60%);
  border-radius: 8px;
  border: 1px solid rgba(242, 214, 115, 0.25);
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
#centerviewbtn:hover {
  background: rgb(0 0 0 / 60%);
  border: 1px solid rgba(242, 214, 115, 0.5);
  color: white;
}
#centerviewbtn a {
 white-space: nowrap
}
#centerviewbtn .fa {
  margin-right: 4px;
}

#rightside {
  min-width: 380px;
  width: var(--right-panel-width);
  padding: 0;
  position: relative;
  -webkit-box-shadow: inset 0 0 10px rgb(255 229 222 / 13%);
  -moz-box-shadow: inset 0 0 10px rgb(255 229 222 / 13%);
  box-shadow: inset 0 0 10px rgb(255 229 222 / 13%);
  background: var(--background-darker);

  --asset-outline-inner-color: #0000009c;
  --asset-outline-inner-thickness: 1px;
  --asset-outline-inner-blur: 0px;
  --asset-outline-outer-color: #9dd8ff;
  --asset-outline-outer-thickness: 0px;
  --asset-outline-outer-blur: 2px;
  --asset-outline-background-color: #0047f0;
  --asset-outline-background-blur: 8px;
}

#rightside #rightsidelogo {
  display: block;
  position: absolute;
  transform: translate(-50%, -100%);
  left: 50%;
  top: 50%;
  filter: grayscale(0.8) contrast(0.5) brightness(0.30);
  pointer-events: none;
  z-index: 5;
}

.dynamicbuttons {
  overflow: initial;
}

.dynamicbuttonsmobile {
  display: none;
}

.scenemenu {
  white-space: nowrap;
}

.scenename {
  display: inline-block;
  max-width: 30vw;
  overflow: hidden;
  vertical-align: top;
  text-overflow: ellipsis;
}

#saveasmodal {
  text-align: center;
  z-index: 2005;
}
#saveasmodal .fa {
  margin-right: 2px;
}
#saveasmodal .modal-body {
  color: var(--text-color);
}
#saveasmodal .modal-body > div {
  color: var(--text-color);
  margin-top: 22px;
  /*margin-bottom: 8px;*/
}
#saveasmodal .text-error {
  display: block;
}
#saveasmodal .labeldivider {
  color: var(--text-color-darker);
  font-size: small;
}
#saveasmodal .field {
  padding: 2px;
}
#saveasmodal input::selection {
  color: black;
  background: rgb(170, 210, 255);
}
#saveasmodal input[type="password"] {
  width: 70px;
}

#saveasmodal .instructions {
  margin-right: 2px;
  color: var(--text-color-dark);
  font-size: small;
  line-height: 1.4;
  text-align: left;
  width: fit-content;
  margin: auto auto 10px auto;
}
#saveasmodal .instructions ul {
  margin: 4px;
}

.divider-right {
  min-width: 30px;
}



.editortools {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 11;
  display: flex;
}
.editortools > div {
  display: flex;
  margin: 0px 4px;
}
.editortools button {
  color: var(--text-color);
  /* border-radius: 0; */
  font-size: x-large;
  padding: 0 6px;
  margin: 0;
  background: rgba(41, 39, 37, 0.78);
  height: 100%;
  border-radius: 4px;
  box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3);
}
.editortools button:first-child,
.editortools button:last-child {
  padding: 0 6px;
}
.editortools button[disabled] {
  opacity: 0.5;
}
.editortools button.active {
  --text-color: white;
  color: white;
  background: #336c9e;
  border-color: #2f9cc9;
  /* background: linear-gradient( to top, #0072bb -50%, rgba(0, 0, 0, 1) 90% ); */
}
.editortools button [data-icon] { 
  display: block;
  height: fit-content;
  width: fit-content;
  padding: 9px 4px;
}
.editortools button .fa {
  padding: 0 8px;
}
.editortools button [data-icon] svg {
  /*background: blue;*/
  width: 32px;
  height: 32px;
  display: block;
  /*vertical-align: text-bottom;*/
}

.editortools .radio button {
  border-radius: 0;
}
.editortools .radio button:first-child {
  border-radius: 4px 0 0 4px;
}
.editortools .radio button:last-child {
  border-radius: 0 4px 4px 0;
}

.editortools .radio button:not(.active) {
  border-bottom: 2px solid var(--button-lightblue);
}



/* Small Screen */
@media only screen and (max-width: 1110px) {
  .editortools {
    /* top: 2px; */
  }
  .editortools .radio button [data-icon] svg {
    width: 24px;
    height: 24px;
  }
  .editortools button {
    font-size: initial;
  }

  #sizinghelpersettings {
    padding: 0 10px;
  }

  #sizinghelpersettings .desktopdisplay {
    display: none !important;
  }

  #sizinghelpersettings .mobiledisplay {
    display: inherit !important;
  }

  #sizinghelpersettings .optionsorthographic select {
    max-width:80px;
  }
}

@media only screen and (max-width: 900px) {
  #rightside {
    max-width: 300px;
    min-width: unset;
  }

  #rightside #rightsidelogo {
    width: 200px;
  }

  #centerviewbtn {
    display: none;
  }

  .editortools .radio {
    top: 2px;
  }
  .editortools .radio button {
    /*padding: 4px 10px;*/
    font-size: initial;
  }
  .editortools .radio button [data-icon] { 
    padding: 3px 0;
  }
}

@media only screen and (max-width: 820px) {
  #editor.h-container {
    flex-direction: column;
  }

  #rightside {
    max-width: 100%;
    width: 100%;
    height: 38%;
  }

  #rightside #rightsidelogo {
    width: 250px;
  }

  .dynamicbuttons {
    display: inline-block;
    white-space: nowrap;
    width: fit-content;
    min-width: fit-content;
  }

  .dynamicbuttonsmobile {
    display: block;
  }

  .v-container.dynamicbuttons {
    flex-direction: row;
  }

  .v-container.rightbuttonpanel {
    flex-direction: row;
    overflow-x: auto;
    pointer-events: auto;
  }

}

/* Mobile */
@media only screen and (max-width: 560px) {

  .editortools {
    /* top: 2px; */
    right: 4px;
    left: auto;
    transform: translateX(0);
    top: 50%;
    transform: translateY(-50%);
  }

  .editortools > div {
    margin: 8px 0;
  }

  .editortools .radio {
    display: flex;
    /* margin: 0px 4px; */
    flex-direction: column;
    width: 40px;
  }

  .editortools .radio button:not(.active) {
    border-bottom: 2px solid transparent;
    border-top: 2px solid transparent;
  }

  .editortools .radio button:not(.active) {
    border-right: 2px solid var(--button-lightblue);
  }

  #middlebuttons {
    top: 30px;
  }

  #sizinghelpersettings {
    padding: 0 5px;
  }
}


.communitypresets {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

.communitypreset {
  margin: 12px 4px;
  box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.25);
  width: 250px;
}

.communitypreset .thumbnail {
  cursor: pointer;
  /*background: linear-gradient(to top, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0) 40%);*/
  background: rgba(255, 255, 255, 0.05);
}
.communitypreset .thumbnail:hover {
  filter: brightness(108%);
}
.communitypreset img {
  display: block;
  width: 100%;
  height: auto;
  /*padding: 0px 12px;*/
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5))
          brightness(100%)
          saturate(120%)
          contrast(110%);
}

.communitypreset .infobox {
  background: var(--background-dark);
  text-align: left;
  padding: 8px 12px;
  line-height: 1.4;
  /*border-radius: 0 0 4px 4px;*/
  border: 1px solid rgba(0, 0, 0, 0.25);
}

.communitypreset .title {
  font-size: large;
  width: fit-content;
  white-space: nowrap;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  max-width: 200px;
}
.communitypreset .title:hover {
  text-decoration: underline;
}
.communitypreset .byline {
  font-size: small;
  font-style: italic;
  margin-left: 2px;
  color: var(--text-color-darker);
}
.communitypreset .screenname {
  color: var(--text-color-teal);
  text-decoration: none;
}
.communitypreset .screenname:hover {
  /*text-decoration: underline;*/
}

.communitypreset .stats {
  margin-top: 2px;
  text-align: right;
  align-self: flex-end;
  color: var(--text-color-darker);
  font-size: 91%;
}

.communitypreset .stats > div:first-child {
  padding-bottom: 2px;
}

.communitypreset .stars {
  cursor: pointer;
  white-space: nowrap;
}

.communitypreset .stars.active {
  color: #ffffa0;
  filter: drop-shadow(0 0 2px rgba(255, 200, 0, 0.75));
  /*filter: drop-shadow(1px 0px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(-1px 0px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(0px 1px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(0px -1px 2px rgba(150, 200, 255, 0.4));*/
}
.communitypreset .stars:hover {
  color: white;
}
.communitypreset .stars:not(.active):not(:hover) .fa {
  display: none;
}
.communitypreset .stars.active .far,
.communitypreset .stars:hover .far {
  display: none;
}
.communitypreset .usedin {white-space: nowrap;}

.communitypreset .fa {
  /*color: var(--text-color-warning);*/
}

.communityfilters {
  text-align: left;
  min-width: 220px;
  overflow-y: auto;
  padding-left: 4px;
  padding-top: 4px;
}

.communityfilters .textdivider {
  font-size: small;
  color: var(--text-color-darker);
}
.communityfilters .textdivider .h-divider {
  margin-left: 4px;
  margin-right: 4px;
  color: var(--text-color);
}
.communityfilters .resetall {
  text-decoration: none;
  /*font-size: small;*/
  /*transform: translateY(3px);*/
  /*display: block;*/
  /*width: fit-content;*/
  /*margin-left: auto;*/
}
.communityfilters .resetall .times {
  display: inline-block;
  transform: scale(1.3) translateY(-1px);
}


.communityfilters .search {
  margin-top: 14px;
  margin-bottom: 30px;
}

.communityfilters .search > div {
  background: var(--background-dark);
  border-radius: 8px;
  transition: all 0.3s ease;
}
.communityfilters .search.active > div {
  background: var(--text-color-teal);
}

.communityfilters .search .fa {
  margin-left: 8px;
  margin-right: 4px;
  display: block;
  align-self: center;
  color: var(--text-color);
  transition: color 0.3s ease;
}
.communityfilters .search.active .fa {
  color: white;
}

.communityfilters .search input {
  font-size: revert;  /* otherwise doesn't respect flexbox, grows too big */
  padding: 4px;
  padding-left: 10px;
  min-width: 0;
  transition: all 0.3s ease;
}
.communityfilters .search.active input {
  border: 2px var(--text-color-teal) solid;
}

.communityfilters .search .clearsearch {
  margin: 0 4px;
  align-self: center;
  font-size: larger;
  cursor: pointer;
  transform: scale(1.4) translate(3px, -1px);
  display: none;
  color: var(--text-color);
}
.communityfilters .search .clearsearch:hover {
  color: white;
}
.communityfilters .search.active .clearsearch {
  display: unset;
}

.communityfilters .filtercategory {
  margin-top: 8px;
}

.communityfilters .filtercategory .title {
  white-space: nowrap;
  font-family: 'cairo-semibold';
  cursor: pointer;
  color: white;
}
.communityfilters .filtercategory .title .fa-caret-right {  /* hidden panel arrow */
  margin-right: 6px;
  margin-left: 2px;
}
.communityfilters .filtercategory .reset {
  margin-left: 6px;
  text-decoration: none;
  display: inline-block;
  transform: scale(1.3) translateY(-1px);
}


.communityfilters .filtercategory select {
  width: 100%;
  margin: 0 0 8px 0;
}
.communityfilters .filtertag {
  margin-left: 20px;
  line-height: 1.5;
}
.communityfilters .multiselect .filtertag {
  color: var(--text-color);
}

.communityfilters .filtercategory.singlechild .header {
  display: none;
}
.communityfilters .filtercategory.singlechild .filtertag {
  margin-left: 0;
}

.appview {
  pointer-events: none;
  z-index: 21;
  display: none;
}

.appview button,
.appview select,
.appview input,
.appview .dropdown .dropdown-button,
.appview .dropdown .dropdown-items,
.appview .btn {
  pointer-events: auto;
}

#characterspanel {
  margin: 15px 0 0 2px;
  padding: 12px 2px 7px 2px;
  width: var(--characterspanel-width);
  max-width: var(--characterspanel-width);
  overflow-y: auto;
  text-align: center;
  min-width: 50px;
  overflow: visible;
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+/Edge */
  user-select: none; /* Standard */
}

#characterspanel > .header {
  font-size: small;
  text-align: center;
  width: 63px;
  margin-bottom: 2px;
  color: var(--text-color);
  font-family: 'cairo-semibold';
  text-decoration: underline;
  text-shadow: 1px 1px 1px rgb(0 0 0 / 60%);
}

#characterspanel .buttonscontainer {
  overflow-x: hidden;
  overflow-y: auto;
  pointer-events: auto;
}




.managecharacteritems {
  width: 150px;
}
.managecharacteritems a[name="showhide"].active .showbutton {
  display: none;
}
.managecharacteritems a[name="showhide"]:not(.active) .hidebutton {
  display: none;
}

.managecharacteritems > .header {
  font-size: small;
  color: var(--text-color-dark);
  font-family: 'cairo-semibold';
  background: var(--background-dark);
  border-radius: 4px 4px 0 0;
  border-bottom: 1px solid var(--background-darker);
  font-style: italic;
}



#characterspanel .title {
  font-size: 90%;
  color: var(--main-button-text-color);
  text-decoration: underline;
  margin-top: 5px;
}

#characterspanel .characterthumbnail {
  overflow: hidden;
  width: 50px;
  height: 60px;
  padding-left: 0;
  padding-right: 0;
  background: #13091b;
  border-radius: 20px;
  border: 2px solid rgb(255 255 255 / 18%);
  cursor: pointer;
  position: relative;
  margin: 3px;
  -webkit-box-shadow: inset 0 0 30px rgb(65 53 75), 2px 3px 4px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0 0 30px rgb(65 53 75), 2px 3px 4px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 0 30px rgb(65 53 75), 2px 3px 4px rgba(0, 0, 0, 0.4);

  transition: unset;
}

#characterspanel .managecharacterrow.active .characterthumbnail,
#characterspanel .managecharacterrow.active:hover .characterthumbnail {
  filter: brightness(135%);
  pointer-events: none;
}
#characterspanel .managecharacterrow:hover .characterthumbnail {
  filter: brightness(135%);
  border-color: #465965;
}


#characterspanel .managecharacterrow.active .characterthumbnail {
  border-color: #76c9ff;
  -webkit-box-shadow: inset 0 0 8px rgb(0 174 255);
  -moz-box-shadow: inset 0 0 8px rgb(0 174 255);
  box-shadow: inset 0 0 8px rgb(0 174 255);
}

#characterspanel .managecharacterrow > .h-container {
  margin-left: 8px;
}

#characterspanel .managecharacterrow .name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /*display: block;*/
  max-width: 80px;
  font-size: smaller;
  font-family: 'cairo-semibold';
  text-shadow: 1px 1px 1px black, 2px 2px 1px black, 0 -1px 2px black;
  text-align: center;
  transform: translateY(-3px);
  line-height: 1.2;
  cursor: pointer;
}
#characterspanel .managecharacterrow.active .name {
  color: white;
}

#characterspanel .managecharacterrow .characterthumbnail img {
  position: absolute;
  left: 50%;
  bottom: -10%;
  transform: translateX(-50%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.1s ease;
}

.addcharacterdropdown {
  width: 60px;
  margin-top: 4px;
  margin-left: 7px;
}
.addcharacterdropdown button {
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
  box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.3);
}
.addcharacterdropdown button.pulse {
  --pulse-color: rgba(242, 214, 115, 1);
  animation: pulse 2s infinite;
}



#characterspanel .managecharacterrow .dropdown {
  margin-left: 8px;
  align-self: center;
}
#characterspanel .managecharacterrow .dropdown .dropdown-button {
  display: none;
  text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.4);
  padding: 2px;
}

#characterspanel .managecharacterrow.active .dropdown .dropdown-button,
#characterspanel .managecharacterrow:hover .dropdown .dropdown-button {
  display: initial;
}


/* Tablet stuff */
@media only screen and (max-width: 900px) {
  #characterspanel .managecharacterrow {
    font-size: smaller;
  }

  #characterspanel .characterthumbnail {
    width: 20px;
    min-width: 20px;
    margin-left: 0;
    margin-right: 0;
    height: 30px;
  }

  #characterspanel .characterthumbnail img {
    width: 200%;
    bottom: -60%;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {

}
.selectboneview {
  display: absolute;
}

.selectboneview .instructions {
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: 15px;
  text-align: center;
  text-shadow: 1px 1px 2px black, 1px 1px 2px black;
  color: var(--text-color);
  width: 100%;
}

.selectboneview .instructions span {
  display: block;
}

.selectboneview .instructions button {
  box-shadow: 1px 4px 8px rgba(0, 0, 0, .7);
  font-size: 1.2em;
}

/* Tablet stuff */
@media only screen and (max-width: 900px) {
  .selectboneview .instructions {
    top: 0;
    font-size: small;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .selectboneview .instructions {
    top: calc(100% - 70px);
  }
}

.choosecharacterview {
  display: absolute;
}

.choosecharacterview .instructions {
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: 15px;
  text-align: center;
  text-shadow: 1px 1px 2px black, 1px 1px 2px black;
  color: var(--text-color);
  width: 100%;
}

.choosecharacterview .instructions span {
  display: block;
}

.choosecharacterview .instructions button {
  box-shadow: 1px 4px 8px rgba(0, 0, 0, .7);
  font-size: 1.2em;
}

/* Tablet stuff */
@media only screen and (max-width: 900px) {
  .choosecharacterview .instructions {
    top: 0;
    font-size: small;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .choosecharacterview .instructions {
    top: calc(100% - 70px);
  }
}

#apptoolbarpanel {
  overflow: visible;
}

#apptoolbarpanel .toolbaritem {
  cursor: pointer;
  pointer-events: auto;
  font-size: 180%;
  margin-left: 5px;
  padding: 5px;
  color: var(--text-color-brownish);
  text-shadow: 2px 3px 4px rgba(0, 0, 0, 0.4);
  /*  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;*/
}

#apptoolbarpanel #undobtn {
  margin-left: 12px;
}
#apptoolbarpanel #redobtn {
  margin-right: 8px;
}


#undobtn[disabled],
#redobtn[disabled] {
  opacity: 50%;
  pointer-events: none;
}

#apptoolbarpanel > .buttons > * {
  align-self: flex-end;
}

#apptoolbarpanel > .buttons > span:hover {
  /*color: var(--text-color-brownish-light);*/
}

#apptoolbarpanel .toolbaritem > a {
  color: var(--text-color-brownish);
  /*font-size: 15px;*/
  /*-webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;*/
}

#apptoolbarpanel .toolbaritem > *:hover {
  color: var(--text-color-brownish-light);
}

#apptoolbarpanel .helpbtn,
#apptoolbarpanel .settingsbtn {
  display: block;
}

#apptoolbarpanel #helpdropdown .dropdown-items,
#apptoolbarpanel #settingsdropdown .dropdown-items {
  text-align: left;
}

#apptoolbarpanel #settingsdropdown .dropdown-items {
  overflow-y: auto;
}

#apptoolbarpanel #helpdropdown a,
#apptoolbarpanel #settingsdropdown a {
  /*white-space: nowrap;*/
}

.settingsitems {
  text-align: left;
}

#undobtn {
  margin-left: 8px;
}

.settingsitems .info {
  font-size: smaller;
  /*max-width: 100%;*/
  white-space: initial;
  text-align: center;
  margin: 8px;
  padding: 0 4px;
  color: var(--text-color-dark);
  font-style: italic;
  line-height: 1.5;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  #apptoolbarpanel #undobtn {
    margin-left: 18px;
  }

  #apptoolbarpanel #settingsdropdown .dropdown-items {
    max-height: 72vh;
  }

  #apptoolbarpanel .toolbaritem {
    font-size: 140%;
    padding: 0 3px;
  }

  #apptoolbarpanel .toolbaritem {
    font-size: 120%;
    padding: 0 1px;
  }

  #apptoolbarpanel .buttons {
    /*background: var(--background-dark);*/
    background: rgba(20, 19, 19, .75);
    box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.4);
    border-radius: 0 0 4px 0;
    flex-grow: 0;
  }
}

/* Phone */
@media only screen and (max-width: 560px) {
  #managesceneview {
    font-size: smaller;
  }

  #apptoolbarpanel {
    flex-flow: wrap-reverse;
  }

  #apptoolbarpanel #settingsdropdown .dropdown-items {
    max-height: 48vh;
  }

  #apptoolbarpanel .toolbaritem,
  #apptoolbarpanel .toolbaritem a {
    /*color: #76717d;*/
    text-shadow: none;
  }

  #apptoolbarpanel .toolbaritem .fa:hover,
  #apptoolbarpanel .toolbaritem a .fa:hover {
    /*color: #76717d;*/
  }

  #apptoolbarpanel .toolbaritem {
    font-size: 120%;
    padding: 0 1px;
    /*color: #76717d;*/
    text-shadow: none;
  }

  #apptoolbarpanel .dropdown-items {
    bottom: unset !important;
  }
}
#rightside .searchbtn {
  color: var(--text-color-darker);
  min-width: 20px;
  padding: 2px 5px;
  text-align: center;
}
#rightside .searchbtn:hover {
  color: var(--text-color);
}
#rightside .searchbtn .fa {
  transform: translateY(-1px);
  margin-left: 5px;
}

#rightside.searchmode {
  overflow-y: auto;
  /* display: flex; */
}
#rightside.searchmode .tabsectionscontainer,
#rightside.searchmode .tabsection,
#rightside.searchmode .subtabsectionscontainer,
#rightside.searchmode .subtabsection,
#rightside.searchmode .subtabsection > div,
#rightside.searchmode .itemscontainer,
#rightside.searchmode .mainsection {
  display: inline !important;
  padding: 0;
}
#rightside.searchmode .mainsection {
  display: none;
}
#rightside.searchmode .mainsection.hasassets .tabpanel.hide,
#rightside.searchmode .mainsection.hasassets.hide {
  display: inline !important;
  flex-shrink: 0;
}
#rightside.searchmode .assetentry.hide,
#rightside.searchmode .assetentry {
  display: none !important;
}
#rightside.searchmode .assetentry.hide.matchessearch,
#rightside.searchmode .assetentry.matchessearch {
  display: inline !important;
}
#rightside.searchmode .topbuttons,
#rightside.searchmode .scrolltabscontainer,
#rightside.searchmode .sliderentry,
#rightside.searchmode .subtabheader,
#rightside.searchmode .posedeltapresetentry,
#rightside.searchmode .bottommessage {
  display: none;
}
#rightside.searchmode .subtabsection {
  margin-bottom: 0;
}
#rightside.searchmode .itemscontainer {
  padding: 0;
  overflow-y: hidden;
}
#rightside.searchmode .tabsectionscontainer {
  padding: 0;
  border: none;
  background: inherit;
}


#rightside .searchassetsdiv {
  text-align: center;
  margin-top: 12px;
}
#rightside:not(.searchmode) .searchassetsdiv {
  display: none;
}
#rightside .searchassetsdiv .fa {
  color: var(--text-color-dark);
  font-size: large;
}


#rightside .mainsection {
  pointer-events: auto;
  padding: 8px;
  z-index: 6;  /* display in front of #rightsidelogo */
  background: inherit;
}
#rightside .mainsection .topbuttons {
  flex-shrink: 0;
  /*margin-top: 4px;*/
  min-height: 32px;
}
#rightside .mainsection .filterassetsbtn {
  /*display: none;*/
  font-size: 14px;
  /*margin: auto 2px auto 2px;*/
  color: var(--text-color-darker);
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.3s ease;
  min-width: 20px;
  padding: 2px 5px;
  text-align: center;
}
#rightside .mainsection .filterassetsbtn:hover {
  filter: brightness(110%);
  text-decoration: underline;
}
#rightside .mainsection .filterassetsbtn .text {
  display: inline-block;  /* :first-letter selector needs this */;
}
#rightside .mainsection .filterassetsbtn .text.filtersapplied {
  color: var(--link-color);
  font-style: italic;
}
#rightside .mainsection .filterassetsbtn:hover .text {
  text-decoration: underline;  /* display: inline-block means text-decoration doesn't get inherited */
}
#rightside .mainsection .filterassetsbtn .text:first-letter {
  text-transform: uppercase;
}
#rightside .mainsection .filterassetsbtn .fa {
  margin-right: 2px;
  width: 100%;
  vertical-align: middle;
}
/* Hide top panel (including filter button) on pose tab */
#rightside #\31 d49e1b6-048e-4b32-a0f7-5408ba398f68 .topbuttons {
  display: none;
}
#rightside #\31 d49e1b6-048e-4b32-a0f7-5408ba398f68 .tabpanel {
  margin-top: 8px;
}

#rightside .tabpanel {
  border-radius: 0;
}

#rightside .tabbuttonscontainer {
  /* margin-bottom: 4px; */
  padding: 0 8px;
  white-space: nowrap;
  overflow: unset;
  flex-shrink: unset;
  width: 100%;
  justify-content: center;
}

#rightside .tabbuttonscontainer .tabbutton {
  padding: 0px 4px;
  border-bottom: 2px solid transparent;
  color: var(--text-color);
  transition: all 0.3s ease;
  background: linear-gradient( to top, rgba(0, 0, 0, 0) -50%, rgba(0, 0, 0, 0) 90% );
  flex: 1 1 0;
}
#rightside .tabbuttonscontainer .tabbutton.active {
  border-color: #2f9cc9;
  background: linear-gradient( to top, #0072bb -50%, rgba(0, 0, 0, 0) 90% );
}
#rightside .tabbuttonscontainer .tabbutton span {
  display: block;
  transition: all 0.3s ease;
  transform: translateY(1px);
}
#rightside .tabbuttonscontainer .tabbutton.active span {
  color: white;
  transform: translateY(-1px);
}

#rightside input[type=range] {
  margin: 0;
}


#rightside .tabsectionscontainer {
  background: #19181a;
  padding: 0 0 6px 6px;
  border-radius: 6px;
  border: 1px solid #070607;
}

#rightside .tabsection {
  padding: 0;
  background: inherit;
}

/*#rightside .tabs button.active,
#rightside .tabsection {
  background: #19181a;
}*/

.subtabbuttonscontainer::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

#rightside .subtabbuttonscontainer {
  margin-top: 22px;
  width: 52px;
  align-items: flex-end;
}
#rightside .scrolltabs {
  padding-right: 0;
  border-width: 0 2px 0 0;
  border-style: solid;
  border-image: linear-gradient(to bottom, #343335, rgba(0, 0, 0, 0) 75%) 1;
}
#rightside .subtabicon {
  border-right: 2px solid transparent;
  padding: 2px 2px 2px 0;
  --text-color:
  var(
  --text-color-darker);
  margin-bottom: 15px;
  width: 32px;
  height: 32px;
  /*transition: none;*/
}
#rightside .subtabicon:hover {
  background: linear-gradient( to left, #0072bb -50%, rgba(0, 0, 0, 0) 90% );
  border-color: #2f9cc9;
  --text-color: white;
}

#rightside .subtabicon.active {
  background: linear-gradient( to left, #0072bb -50%, rgba(0, 0, 0, 0) 90% );
  border-color: #2f9cc9;
  --text-color: white;
  width: 38px;
  height: 38px;
}
#rightside .subtabicon.active svg {
  width: 38px;
  height: 38px;
}

#rightside .subtabsection {
  margin-bottom: 10px;
}
#rightside .subtabsection .h-divider {
  margin-top: auto;
  margin-bottom: auto;
}
#rightside .subtabsection .subtabtitle {
  color: rgba(216, 216, 216, 0.68);
  font-size: .9em;
}

#rightside .tabsection > div.v-container {
  overflow-y: auto;
  display: inline !important;
  /*flex-basis: 0;*/
}

#rightside .subtabsectionscontainer {
  margin-left: 5px;
  overflow-y: auto;
  scroll-behavior: auto;
  /*scroll-behavior: smooth;*/
  flex-basis: 0;
}

#rightside .itemscontainer {
  border-radius: 15px;
  justify-content: center;
  padding: 2px;
  display: flex;
  flex-wrap: wrap;
  border-radius: 10px;
}
#rightside .thumbnailitem {
  /*width: 135px;*/  /* 125 for thumbnail, 5 for a little extra on the right for icons */
  min-width: 50px;
  border-radius: 10px;
  margin: 4px;
  background: radial-gradient(rgba(29, 28, 29, 0.35), rgba(0, 0, 0, 0) 70%);
  position: relative;
}
#rightside .thumbnailitem img {
  cursor: pointer;
  height: 135px;
  width: auto;
  /*height: auto;*/
  filter: drop-shadow(0 0 5px black);
}
#rightside .thumbnailitem img:hover {
  /*background: var(--background-hover);*/
  /*background: rgba(0, 0, 0, .3);*/
  filter: drop-shadow(var(--asset-outline-inner-thickness) var(--asset-outline-inner-thickness) 1px var(--asset-outline-inner-color))
          drop-shadow(calc(var(--asset-outline-inner-thickness)*-1) var(--asset-outline-inner-thickness) 1px var(--asset-outline-inner-color))
          drop-shadow(var(--asset-outline-inner-thickness) calc(var(--asset-outline-inner-thickness)*-1) 1px var(--asset-outline-inner-color))
          drop-shadow(calc(var(--asset-outline-inner-thickness)*-1) calc(var(--asset-outline-inner-thickness)*-1) 1px var(--asset-outline-inner-color))
          drop-shadow(0 0 7px rgba(50, 200, 255, 0.3))
          drop-shadow(0 0 1px rgba(150, 150, 255, 0.6))
          drop-shadow(0 0 1px rgba(0, 150, 255, 0.5));
}
#rightside .thumbnailitem .dropdownbtn {
  position: absolute;
  pointer-events: all;
  right: 0;
  top: 0;
  padding: 6px;
  cursor: pointer;
  color: var(--text-color-brownish);
  display: none;
}
#rightside .thumbnailitem .dropdownbtn:hover {
  color: var(--text-color-brownish-light);
}
#rightside .thumbnailitem:hover .dropdownbtn {
  display: block;
  pointer-events: all;
}

#rightside .thumbnailitem.active img {
  filter: drop-shadow(var(--asset-outline-inner-thickness) var(--asset-outline-inner-thickness) var(--asset-outline-inner-blur) var(--asset-outline-inner-color))
          drop-shadow(calc(var(--asset-outline-inner-thickness)*-1) var(--asset-outline-inner-thickness) var(--asset-outline-inner-blur) var(--asset-outline-inner-color))
          drop-shadow(var(--asset-outline-inner-thickness) calc(var(--asset-outline-inner-thickness)*-1) var(--asset-outline-inner-blur) var(--asset-outline-inner-color))
          drop-shadow(calc(var(--asset-outline-inner-thickness)*-1) calc(var(--asset-outline-inner-thickness)*-1) var(--asset-outline-inner-blur) var(--asset-outline-inner-color))
          drop-shadow(var(--asset-outline-outer-thickness) var(--asset-outline-outer-thickness) var(--asset-outline-outer-blur) var(--asset-outline-outer-color))
          drop-shadow(calc(var(--asset-outline-outer-thickness)*-1) var(--asset-outline-outer-thickness) var(--asset-outline-outer-blur) var(--asset-outline-outer-color))
          drop-shadow(var(--asset-outline-outer-thickness) calc(var(--asset-outline-outer-thickness)*-1) var(--asset-outline-outer-blur) var(--asset-outline-outer-color))
          drop-shadow(calc(var(--asset-outline-outer-thickness)*-1) calc(var(--asset-outline-outer-thickness)*-1) var(--asset-outline-outer-blur) var(--asset-outline-outer-color))
          drop-shadow(0 0 var(--asset-outline-background-blur) var(--asset-outline-background-color));
}


#rightside .thumbnailitem .icons {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 22px;
  text-align: right;
  --icon-owned-color: #414d67;
  /*background: rgba(0, 0, 0, 0.3);*/
}
#rightside .thumbnailitem .assetpackicon:hover {
  /*background: black;*/
  /*filter: brightness(1.25);*/
}
#rightside .thumbnailitem .thumbnailicon.fa {
  /*transform: translate(-2px, -4px);*/
}
#rightside .thumbnailitem .assetpackicon,
#rightside .thumbnailitem .downloadableicon {
  padding: 2px;
  cursor: default;
  /*text-shadow: 1px 1px 5px rgba(0, 0, 0, 1);*/
  filter: drop-shadow(0 0 1px black) ;
}
#rightside .thumbnailitem .assetpackicon {
  --text-color: #4c4c4c;
  color: #4c4c4c;
  display: inline;
}
#rightside .thumbnailitem .assetpackicon svg {
  width: 18px;
  height: 18px;
  /*transform: translate(-3px, 2px);*/
}
#rightside .thumbnailitem .downloadableicon {
  color: var(--icon-owned-color);
}


/*#rightside .thumbnailitem .thumbnailicon {
  padding: 10px;
}*/
.icontooltip {
  width: 200px;
  color: var(--text-color);
  font-size: small;
  white-space: wrap;
}
.icontooltip .fa {
  margin-right: 4px;
}
.icontooltip .subtext {
  margin-top: 8px;
  color: var(--text-color-highlight);
  font-style: italic;
}
.icontooltip .title {
  font-family: 'cairo-bold';
  font-size: 16px;
}
.icontooltip .assetpackicon {
  /*--text-color: #4c4c4c;*/
  display: inline;
  margin: 0 2px;
}
.icontooltip .assetpackicon svg {
  width: 18px;
  height: 18px;
  transform: translate(0, 3px);
}


#rightside #filters {
  color: var(--text-color-darker);
  padding: 8px 8px 0 8px;
  text-align: center;
}
#rightside #filters input {
  background: #424242;
  border-color: #676767;
  color: var(--text-color);
  padding: 0px 12px;
}
#rightside #filters .fa {
  padding-left: 8px;
}
#rightside #filters #filtersbtn {
  /*font-size: small;
  display: block;*/
}

#mainview {
  --rightbuttonpanel-width: 185px;
  --main-button-color: rgba(87, 83, 79, .7);
  --main-button-text-color: #dddddd;
}

#mainview .rightbuttonpanel {
  /*width: var(--rightbuttonpanel-width);*/
  padding-top: 5px;
  overflow-y: auto;
  pointer-events: auto;
  /*pointer-events: inherit;*/
  min-width: 180px;
  margin-top: 22px;
  max-height: 76%;
}

#mainview .rightbuttonpanel span[data-icon] svg {
  width: 32px;
  height: 32px;
  /* display: block; */
  vertical-align: text-bottom;
  transform: translateY(-2px);
  margin-right: 6px;
}

#mainview #staffdownloadbtn[disabled],
#mainview #addtocart2btn[disabled],
#mainview #addtocartbtn[disabled] {
  filter: brightness(60%) contrast(90%);
}

#mainview #addtocartbtn .loadingspinner {
  color: white;
  display: inline-block;
  transform: scale(0.75) translateY(-2px);
  margin: 0 8px;
}
#mainview #addtocartbtn .loadingdisplay {
  display: none;
  margin-left: 6px;
}
#mainview #addtocartbtn[disabled] .normaldisplay {
  display: none;
}
#mainview #addtocartbtn[disabled] .loadingdisplay {
  display: inline-block;
}

#mainview .rightbuttonpanel > button,
#mainview .rightbuttonpanel > .dynamicbuttons > button {
  background: rgba(41, 39, 37, 0.78);
  padding-top: 4px;
  padding-left: 5px;
  padding-bottom: 4px;
  font-size: 110%;
  color: var(--text-color-darker);
  margin: 1px 0 3px 8px;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.4);
  border-radius: 4px 0 0 4px;
  position: relative;
}

#mainview .rightbuttonpanel > button [data-icon] svg,
#mainview .rightbuttonpanel > .dynamicbuttons > button [data-icon] svg {
  width: 28px;
  height: 28px;
}

#mainview .rightbuttonpanel > button:hover:not([disabled]):not([.active]),
#mainview .rightbuttonpanel > .dynamicbuttons > button:hover:not([disabled]):not([.active]) {
  background: #343230;
}

#mainview .rightbuttonpanel > button[disabled],
#mainview .rightbuttonpanel > .dynamicbuttons > button[disabled] {
  opacity: .55;
}

#mainview .rightbuttonpanel > button.active,
#mainview .rightbuttonpanel > .dynamicbuttons > button.active {
  background: #396e95;
  color: white;
  margin-left: 0;
  padding-right: 20px;
  padding-left: 0;
  border-width: 2px;
  /*border-right: 1px solid #4786b2;
  border-left: 2px solid #4786b2;
  border-bottom: 2px solid #4786b2;
  border-top: 2px solid #4786b2;
  -webkit-box-shadow: inset 0 0 30px rgb(65 53 75);
  -moz-box-shadow: inset 0 0 30px rgb(65 53 75);
  box-shadow: inset 0 0 30px rgb(65 53 75);*/
  /*  background: linear-gradient(
    to right,
    var(--text-color-teal) -100%,
    rgb(41, 39, 37) 80%
  );*/
  /*outline: initial;*/
  /*border-color: var(--text-color-teal);*/
  /*color: var(--text-color-teal);*/
}

#mainview > button > .fas,
#mainview .rightbuttonpanel > button > .fas,
#mainview .rightbuttonpanel > .dynamicbuttons > button .fas {
  margin-right: 7px;
  margin-left: 7px;
  font-size: 18px;
}

#mainview .i-foreground {
  fill: var(--text-color-darker);
}

#mainview .rightbuttonpanel > button.active .i-foreground,
#mainview .rightbuttonpanel > .dynamicbuttons > button.active .i-foreground {
  fill: white;
}

#mainview .fa {
  margin-right: 5px;
}

.mainbtn .banner {
  position: absolute;
  right: 0;
  border-radius: 4px;
  bottom: 2px;
  font-size: small;
  background: #d4c600;
  color: var(--background-main);
  font-family: 'cairo-bold';
  padding: 2px 6px;
  line-height: 1;
}


#mainview #staffdownloadbtn,
#mainview #addtocart2btn,
#mainview #addtocartbtn {
  text-align: center;
  margin: 2px 0 2px 14px;
  background: #4c0014;
  padding: 3px 0;
  border-radius: 4px 0 0 4px;
  font-size: large;
  /*-webkit-box-shadow: inset 0 0 30px black, 2px 3px 4px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0 0 30px black, 2px 3px 4px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 0 30px black, 2px 3px 4px rgba(0, 0, 0, 0.4);*/
  color: white;
  width: calc(100% - 14px);
  box-shadow: 2px 3px rgba(0, 0, 0, 0.3);
}
#mainview #addtocart2btn {
  margin-bottom: 36px;
}
/*#mainview #addtocartbtn {
  background: #555555;
}*/

#mainview #attachbtn,
#mainview #detachbtn,
#mainview #deletebtn {
  margin-left: auto;
  font-family: 'cairo-semibold';
  --highlight-color: #133b64;
  border: none;
  background: rgba(41, 39, 37, 0.78);
  color: var(--main-button-text-color);
  /*border-radius: 20px 0 0 20px;*/
  border-radius: 0;
  padding-top: 3px;
  padding-left: 5px;
  padding-bottom: 5px;
  font-size: 110%;
  margin: 2px 0 2px 8px;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.4);
  /* background: linear-gradient(to left, var(--highlight-color) -20%, rgba(41, 39, 37, 0.78) 80%); */
  background: var(--highlight-color);
}
#mainview #deletebtn {
  --highlight-color: #950000;
}
#mainview #attachbtn,
#mainview #detachbtn {
}

#mainview #undoredo {
  display: none;
}
/*
#mainview #undoredo > button {
  margin: 0;
  font-size: small;
  padding: 0 8px 0 14px;
  background: #3b6286;
  color: white;
  margin-left: 0;
  border-bottom: 2px solid #4786b2;
}
#mainview #undoredo > button:hover:not([disabled]) {
  filter: brightness(0.85);
}
#mainview #undoredo > button[disabled] {
  background: #38485f;
  color: rgba(255, 255, 255, 0.5);
}
#mainview #undobtn {
  border-left: 2px solid #4786b2;
  border-radius: 0 0 0 10px;
  border-right: 1px solid #2c425c;
}
#mainview #redobtn {
  border-right: 1px solid #4786b2;
  border-radius: 0 0 10px 0;
}*/


.assetthumbnaildropdown {
  width: 150px;
}

.assetthumbnaildropdown .message {
  font-size: small;
  font-style: italic;
  color: var(--text-color-disabled);
  white-space: initial;
  padding: 4px 12px;
  background: var(--background-dark);
  line-height: 1.4;
}
.assetthumbnaildropdown a {
  padding: 4px 14px;
  white-space: nowrap;
}

/* Make Sizing pose presets smaller */
#mainsection_2c0611b7-8857-4fdc-8c35-08b9a672da91 .thumbnailitem img {
  height: 90px;
}







@media only screen and (max-width: 900px) {
  #rightside {
    --right-panel-width: 40%;
  }

  #mainview #attachbtn,
  #mainview #detachbtn,
  #mainview #deletebtn {
    margin-left: auto;
    font-size: small;
    padding: 2px 8px 2px 12px;
    background: var(--highlight-color);
  }

  #mainview #addtocart2btn,
  #mainview #addtocartbtn {
    margin-top: 5px;
    margin-bottom: 0px;
  }

  #mainview .rightbuttonpanel {
    max-height: 80%;
    min-width: inherit;
    flex-shrink: 1;
    overflow-x: hidden;
  }

  #mainview .rightbuttonpanel > button {
    margin-left: 10px;
  }

  #mainview .rightbuttonpanel > .dynamicbuttons > button {
    padding-right: 0;
    padding-left: 0;
    margin-left: 14px;
  }

  #mainview .rightbuttonpanel > button.active,
  #mainview .rightbuttonpanel > .dynamicbuttons > button.active {
    margin-left: 0;
    padding-right: 5px;
  }

  #mainview .rightbuttonpanel > button [data-icon],
  #mainview .rightbuttonpanel > button [data-icon] svg {
    width: 32px;
    height: 32px;
    transform: none;
  }

  #characterspanel {
    margin: 10px 0 0 0;
    padding: 0;
  }
  #characterspanel .dropdown-button {
    font-size: small;
    padding: 0 8px;
    transform: translateX(-4px);
  }
}


#rightside .bottommessage {
  text-align: center;
  font-size:  small;
  color: var(--text-color-darker);
  margin-top:  12px;
}


/* Morphs presets */
#bbe31289-eeb1-4df8-9302-73468bbc9ba2 .itemscontainer {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
#bbe31289-eeb1-4df8-9302-73468bbc9ba2 .itemscontainer .morphspreset button {
  width: 100%;
  text-align: center;
  padding: 8px;
  margin: 0;
  background: transparent;
  border-radius: 0;
  border-bottom: 1px solid rgba(255, 246, 236, 0.12);
  border-right: 2px solid rgba(255, 246, 236, 0.12);
  color: var(--text-color);
  font-family: 'cairo-semibold';
  /*background: var(--background-dark);*/

  -webkit-transition: none;
  transition: none;
}
#bbe31289-eeb1-4df8-9302-73468bbc9ba2 .itemscontainer .morphspreset:nth-last-child(-n+3) button {
  border-bottom: 1px solid transparent;
}
#bbe31289-eeb1-4df8-9302-73468bbc9ba2 .itemscontainer .morphspreset:nth-child(3n+1) button {
  border-right: 1px solid transparent;
}
#bbe31289-eeb1-4df8-9302-73468bbc9ba2 .itemscontainer .morphspreset button:hover {
  background: linear-gradient(to top, #0072bb -50%, rgba(0, 0, 0, 0) 90%);
  color: white;
}

.mainsection .assetsviewmessage {
  text-align: center;
  font-size: small;
  position: relative;
  margin: 2px 0;
}
.mainsection .assetsviewmessage .fa {
  margin-right: 3px;
}
.mainsection .assetsviewmessage a {
  margin-left: 8px;
}
.mainsection .assetsviewmessage .cancelbtn {
  text-decoration: none;
  position: absolute;
  font-size: large;
  display: block;
  right: 4px;
  top: -9px;
  padding: 4px;
}


/* Tablet stuff */
@media only screen and (max-width: 900px) {
  #mainview #addtocartbtn .loadingspinner {
    margin: 0;
  }

  #rightside .mainsection {
    /* padding: 2px; */
    padding:  0;
  }

  .h-container.contentpanelcontents {
    flex-direction: column;
  }

  .contentpaneltabs .scrolltabs {
    margin-top: 0;
    flex-direction: row;
    overflow-x: auto;
  }

  .contentpaneltabs .scrolltabs a {
    margin: 0 6px;
  }

  .assetsview {
    padding: 5px;
  }

  .assetsview .assetentry,
  .assetsview .comboassetentry {
    width: 70px;
  }

  .assetsview .assetentry .infobtn,
  .assetsview .comboassetentry .infobtn {
    /*transform: translate(-50%, -25%);*/
    font-size: 80%;
  }

  .assettooltip {
    font-size: 90%;
  }

  .assettooltip .thumbnail {
    width: 175px;
  }

  .assetsview .searchallparts {
    font-size: small;
    margin: 0;
  }

/*  #mainview #undoredo {
    flex-shrink: 0;
  }
  #mainview #undobtn {
    border-radius: 10px 0 0 10px;
  }
  #mainview #redobtn {
    border-radius: 0 0 10px 0;
  }*/

  /* Remove extra margin on stuff */
  #rightside .subtabbuttonscontainer {
    margin-top: 2px;
    width: 50px;
  }

  #rightside .subtabicon,
  #rightside .subtabicon.active {
    width: 32px;
    height: 32px;
  }
  #rightside .subtabicon svg,
  #rightside .subtabicon.active svg {
    width: 32px;
    height: 32px;
  }

  /* Don't do hover effect for mobile (it looks like it stays selected after clicking) */
  #rightside .subtabicon:hover {
    background: inherit;
    border-color: inherit;
    --text-color: inherit;
  }
  #rightside .subtabicon.active:hover {
    background: linear-gradient( to left, #0072bb -50%, rgba(0, 0, 0, 0) 90% );
    border-color: #2f9cc9;
    --text-color: white;
  }

  #mainview {
    width: 65px;
  }

  #mainview #staffdownloadbtn,
  #mainview #addtocart2btn,
  #mainview #addtocartbtn {
    margin-left: auto;
    width: 40px;
    padding: 2px 3px 0 0;
  }
  #mainview #staffdownloadbtn {
    padding: 2px 0 0 4px;
  }
  #mainview #addtocart2btn .fas,
  #mainview #addtocartbtn .fas {
    padding-right: 2px;
    font-size: 16px;
    transform: translate(2px, -1px);
  }

  
  #rightside .mainsection .topbuttons {
    margin-top: 0;
    min-height: 32px;
    font-size: small;
  }


  #rightside .thumbnailitem img {
    height: 90px;
  }

  #managesceneview .dropdown-button,
  #managesceneview .dropdown-button .fa {
    font-size: smaller;
  }

  #mainview #undoredo > button {
    font-size: small;
    padding: 0 4px 0 7px;
  }
}

/* Mobile */
@media only screen and (max-width: 820px) {
  #mainview #addtocart2btn,
  #mainview #addtocartbtn {
    width: auto;
    margin-left: auto;
  }

  #mainview #deletebtn {
    width: auto;
    margin-left: auto;
  }

  #mainview #attachbtn,
  #mainview #detachbtn {
    width: auto;
    margin-left: auto;
  }

  /*#mainview #undoredo > button {
    border: none;
    border-radius: 5px;
  }*/

  #advancedposeview {
    overflow-y: auto;
    position: relative;
  }

  #leftside {
    flex-direction: column-reverse;
  }

  #mainview {
    /*display: inherit;*/
    align-items: flex-end;
    flex-direction: column-reverse;
  }

  /* Make character dropdown go down instead of up */
  #managesceneview .dropdown-items {
    bottom: unset !important;
  }

  #mainview .rightbuttonpanel {
    height: 45px;
    padding-top: 0;
    margin: 0;
    max-width: 100%;
    flex-wrap: nowrap;
    flex-flow: nowrap;
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
  }

  /* Since buttons on on bottom now, round the top corners instead*/
  #mainview .rightbuttonpanel > button {
    background: #1d1c1e;
    margin: 2px 1px 0 2px;
    box-shadow: 3px 3px rgba(0, 0, 0, 0.8);
    padding: 4px 5px 8px 5px;
    border-radius: 4px 4px 0 0;
  }

  /* Since buttons on on bottom now, round the top corners instead*/
  #mainview .rightbuttonpanel > button.active {
    margin: 0 1px 0 2px;
  }

  #mainview .rightbuttonpanel > .dynamicbuttons > button {
    padding: 4px 5px 8px 5px;
    margin: 0;
    border-radius: 4px 4px 0 0;
  }

  #mainview .rightbuttonpanel > button.active,
  #mainview .rightbuttonpanel > .dynamicbuttons > button.active {
    margin: 0;
    padding: 4px 5px 8px 5px;
  }

  #mainview .rightbuttonpanel > button [data-icon],
  #mainview .rightbuttonpanel > button [data-icon] svg {
    margin-bottom: 4px;
  }

  #mainview {
    width: inherit;
  }

  #rightside .tabbuttonscontainer {
    margin: 0 32px;
  }
  #rightside .tabbuttonscontainer .tabbutton {
    font-size: small;
  }

  #rightside .mainsection .filterassetsbtn .text {
    display: none;
  }

}


@media only screen and (max-height: 720px) {
  #mainview .rightbuttonpanel {
    max-height: 80%;
    margin-top: 5px;
  }

  #mainview #addtocart2btn {
    margin-bottom: 0;
  }
}
#rightside .sliderentry {
  margin-bottom: 12px;
  border-radius: 10px;
  padding: 3px;
  transition: background .3s ease;
  text-align: center;
  position: relative;
  width: 100%;
  color: var(--text-color);
}
#rightside .sliderentry .icon {
  margin-right: 3px;
  position: absolute;
  transform: translate(calc(-100% - 10px), -2px);
  width: 28px;
  height: 28px;
}

#rightside .sliderentry .slidercontainer {
  align-items: center;
}

#rightside .sliderentry .title {
/*  font-family: 'cairo-semibold';
  border-radius: 10px;
  transition: background .3s ease;*/
}

#rightside .sliderentry .sliderparts {
  display: flex;
  justify-content: center;
}

#rightside .sliderentry .sliderparts .sliderpart {
  margin: 0 4px 4px 4px;
  font-size: small;
}

#rightside .sliderentry .showhiddenpanelbtn {
  color: var(--text-color-darker);
}

#rightside .sliderentry .leftlabel,
#rightside .sliderentry .rightlabel {
  font-size: smaller;
  color: var(--text-color-darker);
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+/Edge */
  user-select: none; /* Standard */
}
#rightside .sliderentry .leftlabel {
  margin-right: 8px;
}
#rightside .sliderentry .rightlabel {
  margin-left: 8px;
  margin-right: 2px;
}
#rightside .sliderentry input[type="range"] {
  transform: translateY(1px);
}

#rightside .sliderentry .resetbtn {
  cursor: pointer;
  width: 20px;
  transform: translateY(25%);
  color: var(--text-color-darker);
  transition: color .3s ease;
}
#rightside .sliderentry .resetbtn.disabled {
  pointer-events: none;
  color: var(--text-color-disabled);
}
#rightside .sliderentry .resetbtn:not(.disabled):hover {
  color: white;
}

#rightside .sliderentry .resetallbtn {
  position: absolute;
  top: 5px;
  right: 5px;
  transition: color .3s ease;
}

#rightside .sliderentry .showhiddenpanelbtn {
  color: var(--text-color-darker);
}

#rightside .sliderentry .hiddenpanel {
  background: var(--background-darker);
  padding: 10px 10px 10px 2px;
  border-radius: 10px;
}

#rightside .sliderentry .hiddenpanel .leftlabel,
#rightside .sliderentry .hiddenpanel .rightlabel {
  font-size: small;
}
#rightside .sliderentry .hiddenpanel .rightlabel {
  margin-right: 20px;
}

#rightside .sliderentry .hiddenpanel .partname {
  width: 28px;
  text-align: right;
  margin-right: 5px;
  /*color: var(--text-color-darker);*/
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+/Edge */
  user-select: none; /* Standard */
}

#rightside .sliderentry .hiddenpanel input[type="range"] {
  font-size: small;
  margin: 0 12px;
}
#rightside .sliderentry .hiddenpanel input[type=range]::-webkit-slider-runnable-track {
  height: 4px;
}
#rightside .sliderentry .hiddenpanel input[type=range]::-webkit-slider-thumb {
  height: 12px;
  width: 12px;
}

#rightside .morphsliderparts {
  display: flex;
  justify-content: center;
}

#rightside .morphsliderparts .morphsliderpart {
  margin: 0 4px 4px 4px;
  font-size: small;
}


.slidersubentry {
  padding: 3px;
  border-radius: 10px;
  transition: background .3s ease;
}

#advancedposeview {
  padding: 2px 6px;
  position: relative;
}

#advancedposeview > .rightpanel > div {
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  margin: 10px;
}

#advancedposeview .tabs button {
  margin-top: 5px;
}

#advancedposeview .bonecontrols.show {
  display: block;
}

#advancedposeview .bonecontrols button{
  /*line-height: 1.3;*/
  height: 36px;
}

#advancedposeview .sidebuttons {
  --text-color: var(--text-color-darker);
  color: var(--text-color-darker);
  /*display: grid;*/
  /*width: 100%;*/
  /*grid-template-columns: repeat(2, 1fr);*/
  /* align-content: flex-end; */
  /* margin-bottom: 8px; */
}
#advancedposeview .sidebuttons .resetbtn,
#advancedposeview .numericinput .dropdown-button {
  width: fit-content;
  cursor: pointer;
}
#advancedposeview .sidebuttons .resetbtn:hover,
#advancedposeview .numericinput .dropdown-button:hover {
  --text-color: white;
  color: var(--text-color);
}
#advancedposeview .sidebuttons .resetbtn {
  margin-left: auto;
  padding: 4px;
  font-size: larger;
}
#advancedposeview .sidebuttons .resetbtn[disabled] {
  pointer-events: none;
  color: var(--text-color-disabled);
}
#advancedposeview .numericinput {
  text-align: right;
  padding: 6px 0 6px 0;
}
#advancedposeview .numericinput .dropdown-button {
}

#advancedposeview .secondrowbuttons {
  font-size: small;
  display: grid;
  margin: 10px 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  text-align: center;
}

#advancedposeview .axesselect {

}

#advancedposeview .bonelimitsbtn,
#advancedposeview .togglefullpartbtn {
  margin-right: auto;
  margin-left: auto;
  --text-color: var(--text-color-dark);
  color: var(--text-color-dark);
  cursor: pointer;
  /*align-self: center;*/
  /*justify-self: flex-start;*/
  white-space: nowrap;
}
#advancedposeview .bonelimitsbtn.active,
#advancedposeview .togglefullpartbtn.active {
  --text-color: inherit;
  color: var(--text-color);
}
#advancedposeview .bonelimitsbtn .fa,
#advancedposeview .togglefullpartbtn .fa {
  margin-right: 2px;
}
#advancedposeview .bonelimitsbtn.active .toggleoff,
#advancedposeview .togglefullpartbtn.active .toggleoff {
  display: none;
}
#advancedposeview .bonelimitsbtn:not(.active) .toggleon,
#advancedposeview .togglefullpartbtn:not(.active) .toggleon {
  display: none;
}

#advancedposeview .bonelimitsbtn[disabled] {
  --text-color: var(--text-color-disabled);
  color: var(--text-color-disabled);
  cursor: default;
}

.exitadvancedposebtn {
  font-size: small;
  text-align: center;
  display: block;
}


.numericinputdropdown {
  padding: 8px;
}
.numericinputdropdown .closebtn {
  color: var(--link-color);
  position: absolute;
  top: -8px;
  right: 8px;
  font-size: x-large;
  width: fit-content;
  cursor: pointer;
}
.numericinputdropdown .closebtn:hover {
  color: var(--link-color-hover);
}

.numericinputdropdown.dropdown-items .section {
  padding: 12px 0;
  font-size: small;
  line-height: 1.5;
}
.numericinputdropdown .title {
  font-family: 'cairo-semibold';
}
.numericinputdropdown .title [data-icon] {
  vertical-align: top;
  margin-right: 2px;
}

.numericinputdropdown .line {
  padding: 0 24px;
  display: flex;
  justify-content: space-around;
  position: relative;
}
.numericinputdropdown .label {
  font-family: 'cairo-bold';
  font-size: x-small;
}
.numericinputdropdown .label [data-axis="x"] {
  color: #ff7f7f;
}
.numericinputdropdown .label [data-axis="y"] {
  color: #45d645;
}
.numericinputdropdown .label [data-axis="z"] {
  color: #00b4ff;
}

.numericinputdropdown input[type="number"] {
  width: 40px;
  text-align: right;
}

/* Disable arrows on number input */
.numericinputdropdown input::-webkit-outer-spin-button,
.numericinputdropdown input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.numericinputdropdown input[type=number] {
  -moz-appearance: textfield;
}

.numericinputdropdown .resetnumericinputsbtn {
  position: absolute;
  right: 0;
  top: 5px;
  cursor: pointer;
  padding: 2px;
}
.numericinputdropdown .resetnumericinputsbtn:hover {
  color: white;
}
/*
.numericinputdropdown .setbtn {
  margin-top: 8px;
}*/



#advancedposeview .buttongroup .fa {
  margin-top: 10px;
  font-size: 1.6em;
}

#advancedposeview .buttongroup {
  transition: none;
}

#advancedposeview .buttongroup .active {
  border-color: #2f9cc9;
  background: linear-gradient( to top, #0072bb -50%, rgb(61 77 107) 90% );
}

#advancedposeview button input[type="checkbox"] {
  pointer-events: none;
  width: 17px;
  height: 17px;
  transform: translateY(2px);
  margin-right: 4px;
}



#advancedposeview .instructions {
  position: absolute;
  transform: translateX(-35%);
  left: 50%;
  top: 15px;
  text-align: center;
  display: none;
}


#advancedposeview #poseadvanced {
  overflow-y: auto;
}

#advancedposeview .subtabtitle .h-divider {
  margin-top: auto;
  margin-bottom: auto;
}

#advancedposeview .divider-right {
  width: 30px;
}

#advancedposeview .subtabtitle {
  color: rgba(216, 216, 216, 0.68);
  font-size: 14px;
}


#advancedposeview .enteradvancedposebtn {
  width: fit-content;
  margin: 8px auto;
  transition: none;
}

#advancedposeview .enteradvancedposebtn.show {
  display: none;
}
#advancedposeview .enteradvancedposebtn .fa {
  display: none;
}
#advancedposeview .hiddenpanel-collapse {
  display: block;
  width: fit-content;
  margin: 0px auto 0 auto;
}

#advancedposeview .helpbtn {
  /*padding: 4px;*/
  /*text-align: right;*/
  /*position: absolute;*/
  /*right: 8px;*/
  /*top: -10px;*/
  margin-left: 2px;
}


#advancedposeview #posesliders {
  margin-top: 10px;
}

#advancedposeview #posesliders .sliderstoolbar {
  display: grid;
  margin: 8px 0;
  grid-template-columns: 1fr repeat(1, auto) 1fr;
  justify-items: center;
  /* align-items: center; */
}

#advancedposeview #posesliders .sliderstoolbar .dropdown {
  color: var(--text-color);
  /*display: block;*/
  font-size: large;
}


#advancedposeview .selecttransformmode {
  grid-column-start: 2
}
#advancedposeview .selecttransformmode .dropdown-button {
  text-decoration: none;
  background: var(--button-lightblue);
  color: white;
  --text-color: white;
  white-space: nowrap;
}
#advancedposeview .selecttransformmode .fa {
  margin-left: 4px;
}
#advancedposeview .selecttransformmode [data-icon] {
  margin-right: 4px;
}
.selecttransformdropdown .item {
  text-align: left;
  margin: 0;
}
.selecttransformdropdown [data-icon] {
  margin-right: 4px;
  display: inline-block;
}
.selecttransformdropdown [data-icon] svg {
  width: 32px;
}


#advancedposeview .sliderstoolbar button {
}
#advancedposeview .poseoptions button {
  padding: 1px 12px;
}

#advancedposeview .transformmode {
  margin-bottom: 2px;
}

#advancedposeview .transformmode button {
  transition: none;
  /*background: var(--background-dark);*/
  background: transparent;
  border-radius: 0;
  padding: 0 5px;
  font-size: 140%;
  height: unset;
  border: none;
  padding: 0 14px;
  border-bottom: 2px solid var(--button-lightblue);
  --text-color: var(--text-color-darker);
}
#advancedposeview .transformmode button.active {
  background: linear-gradient( to top, #0072bb -20%, rgba(0, 0, 0, 0) 100% );
  border: none;
  border-bottom: 3px solid #2f9cc9;
  margin: 0;
  --text-color: white;
}


/*#advancedposeview .transformaxes {
  margin-top:  5px;
  margin-bottom: 5px;
  justify-content: center;
}

#advancedposeview .transformaxes button {
  margin: 2px;
  padding: 4px 10px;
  width: 100%;
  max-width: fit-content;
}*/

#advancedposeview .poseslider {
  justify-content: center;
  align-items: center;
  /* margin-top: 10px; */
  margin-bottom: 20px;
}

#advancedposeview .poseslider .axis {
  /*line-height: 1.1;*/
  margin-right: 4px;
}

.numericinput::-webkit-outer-spin-button,
.numericinput::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#advancedposeview #selectabonemsg {
  width: fit-content;
  margin: 0 auto 16px auto;
}

#advancedposeview .poseslider[data-axis="x"] input:not([disabled])::-moz-range-thumb {
  background-color:rgba(255, 0, 0, 1);
  border: 2px solid var(--range_slider_thumb_color);
}
#advancedposeview .poseslider[data-axis="x"] input:not([disabled])::-webkit-slider-thumb {
  background-color:rgba(255, 0, 0, 1);
  border: 2px solid var(--range_slider_thumb_color);
}

#advancedposeview .poseslider[data-axis="y"] input:not([disabled])::-moz-range-thumb {
  background-color:rgba(0, 255, 0, 1);
  border: 2px solid var(--range_slider_thumb_color);
}
#advancedposeview .poseslider[data-axis="y"] input:not([disabled])::-webkit-slider-thumb {
  background-color:rgba(0, 255, 0, 1);
  border: 2px solid var(--range_slider_thumb_color);
}

#advancedposeview .poseslider[data-axis="z"] input:not([disabled])::-moz-range-thumb {
  background-color:rgba(0, 0, 255, 1);
  border: 2px solid var(--range_slider_thumb_color);
}
#advancedposeview .poseslider[data-axis="z"] input:not([disabled])::-webkit-slider-thumb {
  background-color:rgba(0, 0, 255, 1);
  border: 2px solid var(--range_slider_thumb_color);
}

#advancedposeview #rotatesliders .poseslider[data-axis="z"] input,
#advancedposeview #translatesliders input {
  direction: rtl;  /* Match direction that makes sense (usually) looking from the front */
}

.traversebstbuttons {
  justify-content: center;
}

.traversebstbuttons button {
  padding: 4px 20px;
}
.traversebstbuttons button[disabled] {
  pointer-events: none;
}

.traversebstbuttons .navbutton .fa:not(:first-of-type) {
  margin-left: 8px;
}

.traversebstbuttons .fa-level-up-alt,
.traversebstbuttons .fa-level-down-alt {
  -webkit-transform: rotate(-90deg);
  -ms-transform:rotate(-90deg);
}

.traversebstbuttons .fa-bone {
  -webkit-transform:rotate(-45deg); 
  -ms-transform:rotate(-45deg);
}


#posesliders input {
  --limit-left: 0%;
  --limit-right: 100%;
  --track-limit-color: #283847;
}


#posesliders input::-moz-range-track {
  background: linear-gradient(
    to bottom,
    var(--track-color) 30%,
    white,
    var(--track-color) 60%
  );
}
#posesliders input:not([disabled]):not([bounded])::-webkit-slider-runnable-track {
  background: linear-gradient(
    to bottom,
    var(--track-color) 30%,
    white,
    var(--track-color) 60%
  );
}

#posesliders input::-moz-range-track {
  background: linear-gradient(
    to right,
    var(--track-limit-color) var(--limit-left),
    var(--track-color) var(--limit-left) var(--limit-right),
    var(--track-limit-color) var(--limit-right)
  );
}
#posesliders input::-webkit-slider-runnable-track {
  background: linear-gradient(
    to right,
    var(--track-limit-color) var(--limit-left),
    var(--track-color) var(--limit-left) var(--limit-right),
    var(--track-limit-color) var(--limit-right)
  );
}


.advancedposetoolbardropdown .fa {
  margin-right: 2px;
}

#posebuttons .settings {
  /*height: 36px;*/
  /*margin: 0;*/
}
#posebuttons .settings button {
  /*margin: 1px;*/
  margin: 0 1px;
  padding: 0 11px;
}
#posebuttons .settings [data-icon] {
  padding: 2px 0;
}
#posebuttons .settings button svg {
  /*width: 24px;*/
}
/*#posebuttons .settings .dockposetoolbarbtn {
  padding: 0;
  border: 2px solid var(--background-dark);
}
#posebuttons .settings .dockposetoolbarbtn span {
  color: var(--text-color-dark);
  display: block;
  padding: 0 3px;
  font-size: small;
}*/
#posebuttons .settings .dropdown {
  /*height: fit-content;*/
}


#posebuttons .resetbonebtn,
#posebuttons .axisselect {
  margin-left: 4px;
}

.togglefullparticon span[data-icon="i-xray_arm"] {
  position: absolute;
  --text-color: white;
  transform: scale(1.3);
  z-index: 101;
}
.togglefullparticon span[data-icon="i-xray_body"] {
  position: absolute;
  --text-color: gray;
  transform: scale(1.3);
  z-index: 100;
}
.togglefullparticon span[data-icon="i-xray_outer"] {
  --text-color: black;
  transform: scale(1.3);
  z-index: 99;
}
#advancedposeview .togglefullparticon span[data-icon="i-xray_outer"] {
  --text-color: black;
}
#advancedposeview .togglefullparticon.active span[data-icon="i-xray_body"] {
  --text-color: black;
}
#advancedposeview .togglefullparticon.active span[data-icon="i-xray_outer"] {
  --text-color: #2f9cc9;
}

.axesdropdownitems .item {
  text-align: left;
  cursor: pointer;
  padding: 4px 20px 4px 10px;
}
/*.axesdropdownitems .radiobtn:hover {
  background: var(--background-dark);
}*/
.axesdropdownitems .fa-check {
  margin-right: 4px;
}
.axesdropdownitems .radiobtn:not(.active) .fa-check {
  /*display: none;*/
  opacity: 0;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  #advancedposeview .tabs button {
    margin-top: 0;
    padding: 0 4px;
  }

  #advancedposeview {
    padding: 5px;
    font-size: 80%;
  }

  #posepresets .h-container.grow {
    flex-direction: column;
  }

  .subtabs.v-container {
    flex-direction: row;
  }

  #poseadvanced button {
    border-radius: 10px;
  }

  #advancedposeview button {
    font-size: small;
  }

}

/* Mobile */
@media only screen and (max-width: 560px) {
  #advancedposeview {
    padding: 0 5px 5px 5px;
  }

  #advancedposeview #posesliders {
    margin-top: 2px;
  }

  #posebuttons {
    flex-direction: column;
    width: 40px;
    right: 4px;
    /* top: 130px; */
  }

  #posebuttons button {
    min-width: 40px;
    width: 100%;
    margin-top: 1px;
    margin-bottom: 1px;
  }
}

#tokenmaker {
  color: var(--text-color);
  text-align: center;
}

#tokenmaker input::-webkit-outer-spin-button,
#tokenmaker input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#tokenmaker input[type=number] {
  -moz-appearance: textfield;
  width: 50px;
  text-align: right;
}

#tokenmaker button .fa {
  margin: 0 0 0 3px;
}
#tokenmaker button .fa:first-child {
  margin: 0 3px 0 0;
}

#tokenmaker .downloaddropdown .dropdown-button {
  /*  padding: 8px 22px;
  font-size: large;
  margin: 8px;*/
  /* flex-shrink: 0; */
}

#tokenmaker .exportsettings {
  padding: 8px;
}

#tokenmaker .tabsectionscontainer {
  overflow-y: hidden;
}

#tokenmaker .subtabbuttonscontainer .fa {
  font-size: 24px;
  vertical-align: bottom;
  /*display: block;*/
  margin: 0;
  padding: 0;
}

#tokenmaker .tabbuttonscontainer {
  margin: 4px 0px 2px 0px;
  display: flex;
}
#tokenmaker .sidebuffer {
  width: 20px;
}
#tokenmaker #downloadtokenbtn {
  padding: 8px 22px;
  margin: 8px;
}

#tokenframetabpanel .framecontainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#tokenframetabpanel .frames[disabled] {
  cursor: wait;
}

#tokenmaker .dividerlabel {
  color: var(--text-color-dark);
  font-size: smaller;
  margin-top: 12px;
  align-items: end;
}
#tokenmaker .dividerlabel .h-divider {
  min-width: 30px;
  margin-bottom: 10px;
}
#tokenmaker .dividerlabel .label {
}
#tokenmaker .fa {
  margin-right: 2px;
}
#tokenmaker .categorywarning {
  font-size: small;
  color: var(--text-color-dark);
  margin-bottom: 4px;
}

#tokenframetabpanel .frame {
  width: 125px;
  height: 125px;
  cursor: pointer;
  border-radius: 4px;
  padding: 2px;
  flex-shrink: 0;
}
#tokenframetabpanel .frame:hover {
  filter: brightness(110%);
}
#tokenframetabpanel .frames[disabled] .frame {
  pointer-events: none;
  opacity: 0.5;
}
#tokenframetabpanel .frame img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  display: block;
}

#tokensizecontainer {
  font-size: small;
}

#tokensizecontainer.disabled {
  opacity: 0.3;
  pointer-events: none;
}

#tokenframetabpanel .frame {
  --thumbnail-size: 100px;
  --thumbnail-padding: 8px;
  padding: var(--thumbnail-padding);
  width: var(--thumbnail-size);
  height: var(--thumbnail-size);
  border-radius: 8px;
  margin: 8px;
  position: relative;
}
#tokenframetabpanel .frame:hover {
  background: rgba(26, 47, 61, 0.7);
}
#tokenframetabpanel .frame.active {
  background: rgba(23, 98, 147, 0.7);
}
#tokenframetabpanel .frame img {
  position: absolute;
  width: calc(100% - 2 * var(--thumbnail-padding));
  height: calc(100% - 2 * var(--thumbnail-padding));
  top: var(--thumbnail-padding);
  left: var(--thumbnail-padding);
}
#tokenframetabpanel .frame.empty {
  margin: 12px auto;
  width: 165px;
}
#tokenframetabpanel .frame.empty span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #19181a;
  padding: 0px 10px;
  white-space: nowrap;
}
#tokenframetabpanel .frame:hover span {
  background: #1b2b37;
}
#tokenframetabpanel .frame.active span {
  background: #174c6f;
}

#tokenframetabpanel .frame[data-shape="circle"] .framebackground {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  clip-path: circle(49%);
}
#tokenframetabpanel .frame[data-shape="hex"] .framebackground {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  /*  TokenMakerView.createHexSvgPath(100, 100, 50, 50, 50);  */
  clip-path: path('M 100 50 L 75 93.30127018922192 L 25.00000000000001 93.30127018922194 L 0 50.00000000000001 L 24.99999999999998 6.698729810778083 L 75 6.698729810778069 L 100 50 z');
}
#tokenframetabpanel .framebackground {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  background: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.1),
    rgba(255, 255, 255, 0.1) 10px,
    transparent 10px,
    transparent 22px
  );
}
#tokenframetabpanel .frame.active .framebackground {
  background: repeating-linear-gradient(
    -45deg,
    rgba(200, 200, 200, 0.4),
    rgba(200, 200, 200, 0.4) 10px,
    transparent 10px,
    transparent 22px
  );
}


#tokenmaker .tabsectionscontainer > div {
  background: transparent;
}

#tokenmaker .tabbuttonscontainer .tabbutton span {
  display: inline-block;
}
#tokenmaker .tabbuttonscontainer .tabbutton [data-icon] {
  margin-right: 3px;
}

#tokenframetabpanel {
  overflow-y: auto;
}

#tokenmaterialtabpanel,
#tokenframetabpanel {
  padding: 10px;
}

#tokenmaker .info {
  font-size: small;
  color: var(--text-color-dark);
}

#tokenmaker .line {
  margin-bottom: 12px;
}

#tokenmaker .framedropdown .dropdown-button {
  /*background: transparent;*/
  padding: 8px;
}
#tokenmaker .framedropdown .dropdown-button:hover {
  /*background: var(--background-dark);*/
}

#tokenmaker .framedropdown .dropdown-button .thumbnail {
  padding: 4px;
  border-radius: 8px;
  display: inline-block;
}
#tokenmaker .framedropdown .dropdown-button .thumbnail img {
  vertical-align: middle;
  width: 70px;
  height: auto;
}
#tokenmaker .framedropdown .dropdown-button .thumbnail .label {
  color: white;
  font-family: 'cairo-semibold';
  white-space: nowrap;
}

#tokenmaker .tokensizedropdown .dropdown-button {
  font-size: small;
  margin-left: 8px;
  color: var(--text-color);
}

#tokenmaker .checkboxsettings {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*margin-top: 12px;*/
}
#tokenmaker .checkboxsettings .checkboxbtn {
  padding: 4px;
  margin: 2px 10px;
  align-self: center;
}


#tokenmakeroverlay {
  /* width, height, left and top are set dynamically in token_maker_view.js */
  z-index: 11;
  position: fixed;
  pointer-events: none;

  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
  /*filter: contrast(1.1) brightness(1) saturate(110%);  /* match threejs canvas filter */*/
  opacity: 0.5;
  /*display: none;*/
  /*background: black;*/
}

#tokenmakerframeoverlay {
  z-index: 12;
  position: fixed;
  pointer-events: none;
  /*display: none;*/
}
#tokenmakerframeoverlay .frame {
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
}






.tokenmakerdownloaddropdownitems .item {
  text-align: left;
}

.tokenmakerdownloaddropdownitems .item .description {
  font-size: small;
  margin-left: 6px;
  color: var(--text-color-dark);
}


/*#tokenmakeroverlay > div {
  background: var(--overlay-mask-color);
  backdrop-filter: blur(3px);

}

#tokenmakeroverlay .frame {
  width: 512px;
  height: 512px;
  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;


}*/



@media only screen and (max-width: 900px) {
  #tokenmaker .checkboxsettings .checkboxbtn {
    margin: 0;
    padding: 2px 12px;
    align-self: center;
    font-size: small;
  }
  #tokenmaker .line {
    margin-bottom: 4px;
  }

  #tokenmaker .tabsectionscontainer {
    padding: 0;
  }

  #tokenmaker .subtabsectionscontainer {
    padding: 0;
    margin: 0;
  }

  #tokenframetabpanel .frames {
    flex-wrap: nowrap;
    justify-content: initial;
  }
  #tokenframetabpanel .frames .frame {
  }

  #tokenframetabpanel .frames .frame.empty {
    width: 120px;
    margin: 12px auto 0 auto;
  }
  #tokenframetabpanel .frames .frame {
    width: 60px;
    height: 60px;
    margin: 0;
  }
  #tokenframetabpanel .frame[data-shape="hex"] .framebackground {
    /*  TokenMakerView.createHexSvgPath(100, 100, 50, 50, 50);  */
    clip-path: path('M 60 30 L 45 55.98076211353316 L 15.000000000000007 55.98076211353316 L 0 30.000000000000004 L 14.999999999999986 4.019237886466847 L 45 4.019237886466843 L 60 30 z');
  }

  #tokenmaker .dividerlabel {
    margin-top: 3px;
  }

  #tokenframetabpanel .framecontainer {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-y: hidden;
    overflow-x: auto;
  }
}

#environmenttab {
  color: var(--text-color);
  text-align: center;
}

#environmenttab input::-webkit-outer-spin-button,
#environmenttab input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#environmenttab input[type=number] {
  -moz-appearance: textfield;
  width: 50px;
  text-align: right;
}

#environmenttab button .fa {
  margin: 0 0 0 3px;
}
#environmenttab button .fa:first-child {
  margin: 0 3px 0 0;
}

#environmenttab .downloaddropdown .dropdown-button {
  /*  padding: 8px 22px;
  font-size: large;
  margin: 8px;*/
  /* flex-shrink: 0; */
  }

#environmenttab .tabsectionscontainer {
  overflow-y: hidden;
}

#environmentskysubtappanel {
  margin-top: 4px;
  overflow-y: auto;
}

#environmenttab .subtabbuttonscontainer .fa {
  font-size: 24px;
  vertical-align: bottom;
  /*display: block;*/
  margin: 0;
  padding: 0;
}

#environmenttab .tabbuttonscontainer {
  margin: 4px 0px 2px 0px;
  display: flex;
}
#environmenttab .sidebuffer {
  width: 20px;
}


#environmentskysubtappanel [data-icon] svg {
  --text-color: var(--text-color-dark);
  vertical-align: baseline;
  width: 26px;
  height: 26px;
}

#environmentskysubtappanel .skyboxcontainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#environmentskysubtappanel .skyboxes[disabled] {
  cursor: wait;
}

#environmenttab .dividerlabel {
  color: var(--text-color-dark);
  font-size: smaller;
  margin-top: 12px;
  align-items: end;
}
#environmenttab .dividerlabel .h-divider {
  min-width: 30px;
  margin-bottom: 10px;
}
#environmenttab .dividerlabel .label {
}
#environmenttab .fa {
  margin-right: 2px;
}
#environmenttab .categorywarning {
  font-size: small;
  color: var(--text-color-dark);
  margin-bottom: 4px;
}

#environmentskysubtappanel .skybox {
  width: 125px;
  height: 125px;
  cursor: pointer;
  border-radius: 4px;
  padding: 2px;
  flex-shrink: 0;
}
#environmentskysubtappanel .skybox:hover {
  filter: brightness(110%);
}
#environmentskysubtappanel .skyboxes[disabled] .skybox {
  pointer-events: none;
  opacity: 0.5;
}
#environmentskysubtappanel .skybox img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  display: block;
}

#environmentskysubtappanel .skybox.empty > div,
#environmentskysubtappanel .skybox.gradient > div,
#environmentskysubtappanel .skybox img {
  outline: 1px solid rgba(0, 0, 0, 0.5);
}

#environmentskysubtappanel .skybox.empty {
  /*margin: auto;*/
}

#environmentskysubtappanel .skybox.empty div,
#environmentskysubtappanel .skybox.gradient div {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}

#environmentskysubtappanel .skybox.empty div {

  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
  /*filter: contrast(1.1) brightness(1) saturate(110%);  /* match threejs canvas filter */*/
}


#environmenttab .tabsectionscontainer > div {
  background: transparent;
}

#environmenttab .tabbuttonscontainer .tabbutton span {
  display: inline-block;
}
#environmenttab .tabbuttonscontainer .tabbutton [data-icon] {
  margin-right: 3px;
}

#tokenframetabpanel {
  overflow-y: auto;
}

#tokenmaterialtabpanel,
#tokenframetabpanel {
  padding: 10px;
}

#environmenttab .info {
  font-size: small;
  color: var(--text-color-dark);
}

#environmenttab .line {
  margin-bottom: 12px;
}

#environmenttab .framedropdown .dropdown-button {
  /*background: transparent;*/
  padding: 8px;
}
#environmenttab .framedropdown .dropdown-button:hover {
  /*background: var(--background-dark);*/
}

#environmenttab .framedropdown .dropdown-button .thumbnail {
  padding: 4px;
  border-radius: 8px;
  display: inline-block;
}
#environmenttab .framedropdown .dropdown-button .thumbnail img {
  vertical-align: middle;
  width: 70px;
  height: auto;
}
#environmenttab .framedropdown .dropdown-button .thumbnail .label {
  color: white;
  font-family: 'cairo-semibold';
  white-space: nowrap;
}

#environmenttab .tokensizedropdown .dropdown-button {
  font-size: small;
  margin-left: 8px;
  color: var(--text-color);
}

#environmenttab .checkboxsettings {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*margin-top: 12px;*/
}
#environmenttab .checkboxsettings .checkboxbtn {
  padding: 4px;
  margin: 2px 10px;
  align-self: center;
}
#environmenttab .skyboxsettings {
  flex-shrink: 0;
}
#environmenttab .skyboxsettings > span {
  margin-right: 6px;
  width: 26px;
  flex-shrink: 0;
}
#environmenttab .skyboxsettings .fa {
  align-self: center;
}
#environmenttab .renamebtn,
#environmenttab .newpresetbtn,
#environmenttab .resetbtn {
  cursor: pointer;
  padding: 4px 0 4px 4px;
}
#environmenttab .renamebtn:hover ,
#environmenttab .newpresetbtn:hover,
#environmenttab .resetbtn:hover {
  color: white;
}

#environmenttab .lights {
  text-align: left;
}

#environmenttab .lights .light {
  color: var(--text-color);
  padding: 4px 8px 4px 16px;
  align-items: center;
  width: 100%;
  text-align: left;
  border: none;
  border-left: 3px solid var(--button-lightblue);
  background: transparent;
  transition: none;
  border-radius: 0;
  /*min-height: 38px;*/
}
#environmenttab .lights .light.active {
  background: linear-gradient(to right, #0072bb -20%, rgba(0, 0, 0, 0) 100%);
  border-left: 3px solid #2f9cc9;
  /*padding-left: 20px;*/
}
#environmenttab .lights .light:hover {
  filter: none;
}
#environmenttab .lights .light:not(.active):hover {
  background: linear-gradient(to right, #0072bb50 0%, rgba(0, 0, 0, 0) 100%);
}
#environmenttab .lights .light .lighticon {
  margin-right: 12px;
}
#environmenttab .lightsettings .colorpreview,
#environmenttab .lights .light .colorpreview {
  width: 40px;
  border-radius: 8px;
  border: none;
  display: inline-block;
}
#environmenttab .lights .light .label {
  margin-left: 8px;
}
#environmenttab .lights .light .showhidebtn {
  padding: 6px 12px;
}
#environmenttab .lights .light .deletebtn {
  padding: 6px 6px;
}
#environmenttab .lights .light .showhidebtn:hover,
#environmenttab .lights .light .deletebtn:hover {
  color: white;
}

#environmenttab .lights .addlightsourcebtn {
  margin: 8px;
}

#environmenttab .lightsettings .header {
  margin: 4px;
}
#environmenttab .lightsettings .headerlabel {
  margin-left: 8px;
  display: inline-block;
}
#environmenttab .lightsettings .headerlabel input {
  width: 80px;
}

#environmenttaboverlay {
  /* width, height, left and top are set dynamically in token_maker_view.js */
  z-index: 11;
  position: fixed;
  pointer-events: none;

  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
  /*filter: contrast(1.1) brightness(1) saturate(110%);  /* match threejs canvas filter */*/
  opacity: 0.5;
  /*display: none;*/
  /*background: black;*/
}

#environmenttabframeoverlay {
  z-index: 12;
  position: fixed;
  pointer-events: none;
  /*display: none;*/
}
#environmenttabframeoverlay .frame {
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
}

#dropdowncontainer .dropdown-items.environmentpresets {

}

#dropdowncontainer .dropdown-items.environmentpresets {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

#dropdowncontainer .dropdown-items.environmentpresets .preset {
  border: none;
  border-bottom: 2px solid transparent;
  text-align: center;
  padding: 4px 20px 4px 0;
  margin: 0;
  background: transparent;
  border-radius: 0;
  border-bottom: 1px solid rgba(255, 246, 236, 0.12);
  border-right: 2px solid rgba(255, 246, 236, 0.12);
  color: var(--text-color);
  font-family: 'cairo-semibold';
  -webkit-transition: none;
  transition: none;
}
#dropdowncontainer .dropdown-items.environmentpresets .preset:nth-last-child(-n+3) {
  border-bottom: 1px solid transparent;
}
#dropdowncontainer .dropdown-items.environmentpresets .preset:nth-child(3n) {
  border-right: 1px solid transparent;
}
#dropdowncontainer .dropdown-items.environmentpresets .preset active {
  background: linear-gradient( to top, #0072bb -50%, rgba(0, 0, 0, 0) 90% );
  color: white;
  border-bottom: 2px solid #2f9cc9;
}

.environmentpresets .preset {
}
.environmentpresets .preset .fa-check {
  opacity: 0;
}
.environmentpresets .preset.active .fa-check {
  opacity: 1;
}

#environmenttab .currentpreset {
  margin: 8px 0;
  align-items: center;
  flex-shrink: 0;
}
#environmenttab .currentpreset .dropdown-button {
  margin: 0 6px 0 12px;
  white-space: nowrap;
}
#environmenttab .currentpreset .fa {
  margin-left: 8px;
}

#environmenttab .currentpreset .importbtn,
#environmenttab .currentpreset .exportbtn {
  font-size: 80%;
  /*text-transform: uppercase;*/
  margin: none;
  padding: 2px 8px;
  border-radius: 2px;
  line-height: 1;
  /*background: transparent;*/
}
#environmenttab .currentpreset .importbtn {
  margin-left: 12px;
}

.environmenttabdownloaddropdownitems .item {
  text-align: left;
}

.environmenttabdownloaddropdownitems .item .description {
  font-size: small;
  margin-left: 6px;
  color: var(--text-color-dark);
}


/*#environmenttaboverlay > div {
  background: var(--overlay-mask-color);
  backdrop-filter: blur(3px);

}

#environmenttaboverlay .frame {
  width: 512px;
  height: 512px;
  background: white;
  background-image: linear-gradient(45deg, #cccccc 25%, transparent 25%), linear-gradient(-45deg, #cccccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #cccccc 75%), linear-gradient(-45deg, transparent 75%, #cccccc 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;


}*/



@media only screen and (max-width: 900px) {
  #environmenttab .colorselect {
    height: 100px;
  }
  #environmenttab .currentpreset {
    overflow-x: auto;
  }
  .environmentpresets .preset {
    font-size: small;
  }
  #environmenttab .checkboxsettings .checkboxbtn {
    margin: 0;
    padding: 2px 12px;
    align-self: center;
    font-size: small;
  }
  #environmenttab .line {
    margin-bottom: 4px;
  }

  #environmenttab .tabsectionscontainer {
    padding: 0;
  }

  #environmenttab .subtabsectionscontainer {
    padding: 0;
    margin: 0;
  }

  /*#environmentskysubtappanel {
    flex-direction: column;
    display: block;
    flex-wrap: none;
  }*/
  #environmenttab #tokenenvironmenttabpanel,
  #environmenttab #environmentlightingtabpanel {
    overflow-y: auto;
  }
  #environmentskysubtappanel {
    margin-top: 4px;
    /*overflow-y: hidden;*/
    /*overflow-x: auto;*/
    flex-shrink: 0;
  }

  #tokenframetabpanel .frames,
  #environmentskysubtappanel .skyboxes {
    flex-wrap: nowrap;
    justify-content: initial;
  }
  #tokenframetabpanel .frames .frame,
  #environmentskysubtappanel .skyboxes .skybox {
  }

  #tokenframetabpanel .frames .frame.empty {
    width: 120px;
    margin: 12px auto 0 auto;
  }
  #tokenframetabpanel .frames .frame {
    width: 60px;
    height: 60px;
    margin: 0;
  }
  #tokenframetabpanel .frame[data-shape="hex"] .framebackground {
    /*  environmenttabView.createHexSvgPath(100, 100, 50, 50, 50);  */
    clip-path: path('M 60 30 L 45 55.98076211353316 L 15.000000000000007 55.98076211353316 L 0 30.000000000000004 L 14.999999999999986 4.019237886466847 L 45 4.019237886466843 L 60 30 z');
  }

  #environmentskysubtappanel .skyboxes .skybox.empty,
  #environmentskysubtappanel .skyboxes .skybox.gradient,
  #environmentskysubtappanel .skyboxes .skybox {
    width: 75px;
    height: 75px;
  }

  #environmenttab .dividerlabel {
    margin-top: 3px;
  }

  #tokenframetabpanel .framecontainer,
  #environmentskysubtappanel .skyboxcontainer {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-y: hidden;
    overflow-x: auto;
  }

  #environmenttab .skyboxsettings.line {
    margin-top: 4px;
  }
}

/* Mobile Cursor */
#mobilecolorcursor {
  position: fixed;
  pointer-events: none;
  display: none;
  color: white;
  /* Display changes to flex in js */
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  z-index: 9999;
}

#mobilecolorcursor span {
  width: 100%;
  height: 100%;
  rotate: 90deg;
}

#mobilecolorcursor span svg {
  vertical-align: unset;
}


/* Active Material Panel */

#colorview .activematerialpanel {
  --preview-dimension: 100px;
  --preview-padding-h: 24px;
  --preview-padding-v: 12px;

  max-height: 50vh;
  margin-top: 8px;
  width: 100%;
  background: #19181a;
  padding: 6px;
  border-radius: 6px;
  border: 1px solid #070607;
  overflow: visible;
  overflow-y: auto;
  box-sizing: border-box; /*This makes the css account for padding in the width*/
}

#colorview .activematerialpanel .materialsettings {
  display: flex;
}

#colorview .activematerialpanel .colorheader {
  flex-wrap: wrap;
  justify-content: flex-end;
}

#colorview .activematerialpanel .header {
  text-align:  left;
  font-family: 'cairo-semibold';
  font-size: larger;
  pointer-events: none;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#colorview .activematerialpanel .header .fa {
  margin-left: 3px;
  display: none;
}
#colorview .activematerialpanel .header .fa-cog {
  font-size: smaller;
}
#colorview .activematerialpanel .header.usermaterial {
  pointer-events: auto;
  cursor: pointer;
}
#colorview .activematerialpanel .header.usermaterial:hover {
  color: var(--text-color-light);
}
#colorview .activematerialpanel .header.usermaterial .name {
  text-decoration: underline;
}
#colorview .activematerialpanel .header.usermaterial .fa {
  display: initial;
  text-decoration: none;
}

#colorview .activematerialpanel .tabsnstuff {
  margin-left: auto;
}

#colorview .activematerialpanel .tabs {
  margin-top: auto;
  /*align-self: flex-end;*/
  justify-content: flex-end;
  display: flex;
}
#colorview .activematerialpanel .tabs button {
  /*height: fit-content;*/
  font-size: smaller;
  padding: 8px 18px;
  line-height: 1.6;
  margin: 0;
}
.colorpreview {
  --alpha: 1;
  --activecolor: hsla(var(--hue), var(--sat), var(--val), var(--alpha));
  --activecolorbright: hsl(var(--hue), 100%, 50%);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--activecolor);
  display: inline-block;
  vertical-align: sub;
  border: 1px solid white;
  margin-right: 2px;
  pointer-events: none;
}

/* End Active Material Panel */


.materialpreviewcanvascontainer {
  height: 80px;
  width: 80px;
  /*width: 100%;
  height: 100%;*/
  margin: 5px;
}

.materialpreviewcanvas {
  background: transparent;
  filter: drop-shadow(0 0 4px black);
  cursor: initial;
  position: initial;
}

#colorview {
  color: #d8d8d8;
  text-align: center;
}
#colorview .tabbuttonscontainer {
  margin: 4px 0px 2px 0px;
  display: flex;
}
#colorview .tabsectionscontainer {
  padding: 0;
  background: unset;
  border-radius: 0;
  border: unset;
}

#colormaterialspanel .subtabbuttonscontainer {
  /* hide icons for now */
  /*display: none;*/
}

#colormaterialspanel.tabpanel {
  padding: 0;
}
#colorview .subtabbuttonscontainer {
  flex-shrink: 0;
}
#colorview .subtabsection {
  margin-bottom: 0;
}

#colorview .tabsectionscontainer > div {
  background: transparent;
}
#colorview .tabbuttonscontainer .tabbutton [data-icon] {
  margin-right: 4px;
}
#colorview .subtabsectionscontainer {
  padding-bottom: 50px;
}

#colorviewmaterialspanel {
  overflow-y: auto;
}

.activematerialpanel .toolbar button {
  padding: 4px;
  width: 40px;
  margin: 0;
  background: transparent;
  color: var(--text-color);
  position: relative;
}
.activematerialpanel .toolbar button[disabled] {
  pointer-events: none;
  opacity: 50%;
}

.activematerialpanel .toolbar button[name="inuserlibrary"] {
  --text-color: #e7cd69;
}

#colorviewlayerspanel,
#colorviewmaterialspanel {
  padding: 10px;
}


#colorview .materials {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#colorview .material {
  display: inline-block;
  padding: 8px 8px 0 8px;
  margin: 0 10px;
  cursor: pointer;
  position: relative;
  border-bottom: 3px solid transparent;
}
#colorview .material.active {
  background: linear-gradient( to top, #0072bb -20%, rgba(0, 0, 0, 0) 100% );
  border: none;
  border-bottom: 3px solid #2f9cc9;
}
#colorview .material:not(.active).preview {
  background: linear-gradient( to top, #004775 -20%, rgba(0, 0, 0, 0) 100% );
}
#colorview .material .name {
  display: inline-block;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#colorview .material.active .name {
  color: white;
}
#colorview .material:hover {
  filter: brightness(120%);
}
#colorview .dirtyindicator {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 6px;
  height: 6px;
  pointer-events: none;
  border-radius: 50%;
  background: red;
}

#colorview .userlibraryindicator {
  position: absolute;
  top: 2px;
  left: 4px;
  pointer-events: none;
  font-size: 9px;
  font-family: 'arial';
  color: #e7cd69;
}
#colorview .material .name {
  font-size: smaller;
  margin-top: 2px;
  color: var(--text-color-darker);
}
#colorview .material.usermaterial .name {
  text-decoration: underline;
}

#colorview .material .thumbnail {
  width: 50px;
  height: 50px;
  border-radius: 4px;
  pointer-events: none;
  margin: auto;
}
#colorview .material:hover .thumbnail {
  /*background: rgb(25, 25, 255);*/
  
}
#colorview .material .thumbnail img {
  filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.5));
  display: block;
}

#colorview .upperpanel {
  overflow-y: auto;
  background: #19181a;
  padding: 0 0 6px 6px;
  border-radius: 6px;
  border: 1px solid #070607;
}


.tabpanel[data-tabgroup="colorzones"] {
  padding: 0;
}

#colortools button[data-mode="apply"] svg {
  /*rotate: 90deg;*/
}

#colorview .subtabsectionscontainercontainer {
  position: relative;
}

#newmaterialbtn {
  padding: 4px 18px;
  margin: 0 12px 0 0;
  position: absolute;
  bottom: 0;
  right: 0;
  /*font-size: smaller;*/
  font-family: 'cairo-semibold';
}
#newmaterialbtn .fa {
  margin-right: 2px;
}

.editortools span[data-icon="i-paintbrush"] {
  rotate: 90deg;
}

.materialmobiledisplay {
  display: none;
  overflow: hidden;
}

#colorview .materialmobiledisplay .activematerialpanel {
  margin-top: 0;
}

#editcolorpanel {
  padding-top: 0;
}

.colorselectcontainer .rightside div {
  line-height: 1.4;
}

/* Adjust layout based on small screens */
@media only screen and (max-width: 900px) {
  #colorview .tabsectionscontainer {
    padding: 0;
  }

  #colorview .tabbuttonscontainer .tabbutton span {
    display: inline-block;
  }

  #colorview .subtabsectionscontainer {
    padding: 0;
    margin: 0;
  }

  #colorview .activematerialpanel .tabs button {
    padding: 8px 12px;
  }

  .materialpreviewcanvascontainer, .materialmobiledisplay .materialpreviewcanvas {
    height: 65px;
    width: 65px;
  }
}

/* Adjust layout for extra small mobile devices */
@media only screen and (max-width: 820px), only screen and (max-height: 650px) {
  .materialdesktopdisplay {
    display: none !important;
  }

  .materialmobiledisplay {
    display: inherit !important;
    justify-content: center;
  }

  #colorview .activematerialpanel {
    max-height: 100%;
  }

  #colorview .activematerialpanel .tabs button {
    padding: 8px 18px;
  }

}
.colorselectcontainer {
  justify-content: center;
  padding: 8px;
  gap: 8px;
}
.colorselect {
  touch-action: none;
}

#colorview .activematerialpanel .leftside,
#colorview .activematerialpanel .rightside {
  box-sizing: border-box;
}

#colorview .activematerialpanel .leftside {
  min-width: 235px;
}

#colorview .activematerialpanel .rightside {
  flex-grow: 1;
}

#colorselect {
  --background-color: #19181a;
  padding: 18px;
  position: relative;
  width: fit-content;
  height: fit-content;
  flex-shrink: 0;
}

.tabs[data-tabgroup="colorzones"] button.active,
.tabpanel[data-tabgroup="colorzones"] {
  background: var(--background-dark);
}

.tabs[data-tabgroup="colorzones"] button,
.colorselectcontainer {
  --hue: 0deg;
  --sat: 0%;
  --val: 0%;
  --activecolor: hsl(var(--hue), var(--sat), var(--val));
  --activecolorbright: hsl(var(--hue), 100%, 50%);
}

.colorselect {
  /*width: calc(100% - 16px);*/
  height: 150px;
  margin: 8px;
  /*background: linear-gradient(to right, white, var(--activecolorbright));*/
  position: relative;
  cursor: crosshair;
  background:
    linear-gradient(rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%),
    linear-gradient(to right, hsl(0, 0%, 100%), hsl(var(--hue), 100%, 50%) 100%);
}

.colorselect .handle {
  width: 20px;
  height: 20px;
  transform: translate(-50%, -50%);
  position: absolute;
  left: 10px;
  top: 10px;
  border-radius: 50%;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  background: var(--background-darker);
  cursor: move;
}
.colorselect .handle .innercolor {
  --padding: 4px;
  width: calc(100% - 2 * var(--padding));
  height: calc(100% - 2 * var(--padding));
  background: var(--activecolor);
  border-radius: 50%;
  border: 2px solid white;
  margin: calc(var(--padding) - 2px);
}


.colorselectcontainer input[type=range].hueslider:focus::-webkit-slider-runnable-track,
.colorselectcontainer input[type=range].hueslider::-webkit-slider-runnable-track {
  /*background: linear-gradient(to right, red, magenta, blue, aqua, lime, yellow, red);*/
  background: linear-gradient(to right, transparent 8px, red 9px, magenta, blue, aqua, lime, yellow, red calc(100% - 9px), transparent calc(100% - 8px));
  /*background: linear-gradient(to right, transparent 8px, red 9px, magenta, blue, aqua, lime, yellow, red calc(100% - 9px), transparent calc(100% - 8px));*/
}
.colorselectcontainer input[type=range].opacityslider:focus::-webkit-slider-runnable-track,
.colorselectcontainer input[type=range].opacityslider::-webkit-slider-runnable-track {
  background-image:
    linear-gradient(to right,
      var(--background-dark) 8px,
      transparent 9px,
      var(--activecolor) calc(100% - 9px),
      var(--background-dark) calc(100% - 8px)
    ),
    url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 20 20\"><path fill=\"%23d1d3d4\" d=\"M0 0h10v10H0Z\"/><path fill=\"%23fff\" d=\"M0 10h10v10H0Z\"/><path fill=\"%23d1d3d4\" d=\"M10 10h10v10H10Z\"/><path fill=\"%23fff\" d=\"M10 0h10v10H10Z\"/></svg>");
}

/* Firefox */
.colorselectcontainer input[type=range].hueslider:focus::-moz-range-track,
.colorselectcontainer input[type=range].hueslider::-moz-range-track  {
  background: linear-gradient(to right, var(--background-dark) 8px, red 9px, magenta, blue, aqua, lime, yellow, red calc(100% - 9px), var(--background-dark) calc(100% - 8px));
}
.colorselectcontainer input[type=range].opacityslider:focus::-moz-range-track,
.colorselectcontainer input[type=range].opacityslider::-moz-range-track {
  border-radius: 0;
  background-image:
    linear-gradient(to right,
      var(--background-dark) 8px,
      transparent 9px,
      var(--activecolor) calc(100% - 9px),
      var(--background-dark) calc(100% - 8px)
    ),
    url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 20 20\"><path fill=\"%23d1d3d4\" d=\"M0 0h10v10H0Z\"/><path fill=\"%23fff\" d=\"M0 10h10v10H0Z\"/><path fill=\"%23d1d3d4\" d=\"M10 10h10v10H10Z\"/><path fill=\"%23fff\" d=\"M10 0h10v10H10Z\"/></svg>");
}

.colorselectcontainer input[type=range].hueslider:focus::-ms-track,
.colorselectcontainer input[type=range].hueslider::-ms-track {
  /*background: linear-gradient(to right, red, magenta, blue, aqua, lime, yellow, red);*/
  background: linear-gradient(to right, var(--background-dark) 8px, red 9px, magenta, blue, aqua, lime, yellow, red calc(100% - 9px), var(--background-dark) calc(100% - 8px));
  /*background: linear-gradient(to right, transparent 8px, red 9px, magenta, blue, aqua, lime, yellow, red calc(100% - 9px), transparent calc(100% - 8px));*/
}
.colorselectcontainer input[type=range].opacityslider:focus::-ms-track,
.colorselectcontainer input[type=range].opacityslider::-ms-track {
  background-image:
    linear-gradient(to right,
      var(--background-dark) 8px,
      transparent 9px,
      var(--activecolor) calc(100% - 9px),
      var(--background-dark) calc(100% - 8px)
    ),
    url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 20 20\"><path fill=\"%23d1d3d4\" d=\"M0 0h10v10H0Z\"/><path fill=\"%23fff\" d=\"M0 10h10v10H0Z\"/><path fill=\"%23d1d3d4\" d=\"M10 10h10v10H10Z\"/><path fill=\"%23fff\" d=\"M10 0h10v10H10Z\"/></svg>");
}

.leftside input[type=range] {
  width: 100%;
}

#rightside .colorselectcontainer input[type=range]:not([disabled]) {
  pointer-events: auto;
}
.leftside input[type=range]::-webkit-slider-runnable-track {
  height: 10px;
  cursor: crosshair;
  pointer-events: auto;
  /*border-radius: 0;*/
}
.leftside input[type=range]::-moz-range-track {
  height: 10px;
  cursor: crosshair;
  pointer-events: auto;
  /*border-radius: 0;*/
}
.leftside input[type=range]::-ms-track {
  height: 10px;
  cursor: crosshair;
  pointer-events: auto;
  /*border-radius: 0;*/
}

.tabpanel[data-layername="main"] .blur,
.leftside input[type=range][disabled]::-webkit-slider-runnable-track {
  opacity: 0;
  pointer-events: none;
}
.leftside input[type=range][disabled]::-moz-range-track {
  opacity: 0;
  pointer-events: none;
}
.leftside input[type=range][disabled]::-ms-track {
  opacity: 0;
  pointer-events: none;
}
.leftside input[type=range][disabled]::-webkit-slider-runnable-thumb {
  opacity: 0;
  pointer-events: none;
}
.leftside input[type=range][disabled]::-moz-range-thumb {
  opacity: 0;
  pointer-events: none;
}
.leftside input[type=range][disabled]::-ms-thumb {
  opacity: 0;
  pointer-events: none;
}


.leftside input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--background-darker);
  -webkit-appearance: none;
  margin-top: -3px;
  pointer-events: auto;
  cursor: ew-resize;
}
.leftside input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--background-darker);
  -webkit-appearance: none;
  margin-top: -3px;
  pointer-events: auto;
  cursor: ew-resize;
}
.leftside input[type=range]::-moz-range-thumb {
  pointer-events: auto;
}
.leftside input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--background-darker);
  -webkit-appearance: none;
  margin-top: -3px;
  pointer-events: auto;
  cursor: ew-resize;
}
.leftside input[type=range][disabled]::-webkit-slider-runnable-track,
.leftside input[type=range][disabled]::-webkit-slider-thumb {
  pointer-events: none;
}
.leftside input[type=range][disabled]::-moz-range-track,
.leftside input[type=range][disabled]::-moz-range-thumb {
  pointer-events: none;
}
.leftside input[type=range][disabled]::-ms-track,
.leftside input[type=range][disabled]::-ms-thumb {
  pointer-events: none;
}

#rightside #colorlayerbase,
#rightside #colorlayershadow,
#rightside #colorlayerhighlight {
  border-radius: 4px 0 4px 4px;
}

.colorinputs {
  /*justify-content: flex-end;*/
  width: fit-content;
  margin: auto;
}
.colorinputs .dropdown-button {
  margin-left: 4px;
}
.colorinputs .dropdown-button * {
  flex-shrink: 0;
}
.colorformatdropdownitems {
  font-size: smaller;
}

.colorselectcontainer .hex {
  display: grid;
  grid-template-rows: 1fr 1fr;
  margin: auto;
}
.colorselectcontainer .hex input {
  width: 120px;
}
.colorinputs .rgba {
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.colorinputs .rgba input {
  width: 30px;
}
.colorinputs .rgba input[data-channel="alpha"] {
  width: 40px;
}

#colorlayerbase .colorinputs .rgba [data-channel="alpha"] {
  pointer-events: none;
  opacity: 0.5;
}

.colorinputs input {
  font-family: 'consolas';
  border: 2px #797979 solid;
  border-radius: 6px;
  text-align: center;
  background: transparent;
  color: white;
  -moz-appearance: textfield;
}
.colorinputs input::-webkit-inner-spin-button,
.colorinputs input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}


.colorinputs input:not(:focus):hover {
  background: rgba(255, 255, 255, 0.1);
}
.colorinputs input:focus {
  border-color: #5891bb;
}

.colorinputs .label {
  font-size: smaller;
  color: var(--text-color-darker);
}


@media only screen and (max-width: 900px) {
  .colorselectcontainer {
    flex-wrap: wrap;
  }
}




/*
.leftside input[type=range]::-moz-range-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
  background: var(--track-color);
  border-radius: 50px;
  border: 0px solid #000000;
}
.leftside input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 16px;
  width: 16px;
  border-radius: 50px;
  background: var(--range_slider_thumb_color);
  cursor: pointer;
}
.leftside input[type=range]::-ms-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.leftside input[type=range]::-ms-fill-lower {
  background: var(--track-color);
  border: 0px solid #000000;
  border-radius: 100px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
}
.leftside input[type=range]::-ms-fill-upper {
  background: var(--track-color);
  border: 0px solid #000000;
  border-radius: 100px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);
}
.leftside input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
  border: 0px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 50px;
  background: var(--range_slider_thumb_color);
  cursor: pointer;
}
.leftside input[type=range]:focus::-ms-fill-lower {
  background: var(--track-color);
}
.leftside input[type=range]:focus::-ms-fill-upper {
  background: var(--track-color);
}*/

.selectbindpathsview {
  display: absolute;
}

.selectbindpathsview .attachpoint {
  position: absolute;
  pointer-events: auto;
  cursor: pointer;
  padding: 25px;
  transform: translate(-25px, -25px);
}

.selectbindpathsview .attachpoint span {
  padding: 7px;
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 0.5em;
  background: #00a5cd;
  border-radius: 100%;
  border: 2px solid #005fb1;
}

.selectbindpathsview .attachpoint:hover span{
  background: #00b3cd;
  font-size: 1rem !important;
  padding: 7px !important;
}


.selectbindpathsview .buttons {
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: 15px;
  text-align: center;
  text-shadow: 1px 1px 2px black, 1px 1px 2px black;
  color: var(--text-color);
  width: 100%;
}

.selectbindpathsview .buttons > button {
  box-shadow: 1px 4px 8px rgba(0, 0, 0, .7);
  font-size: 1.2em;
}

.selectbindpathsview .buttons > button.draggingbtn:hover {
  /*padding: 10px 1.2em;*/
  filter: brightness(140%);
  --pulse-color: rgba(115, 214, 242, 0.5);
  padding: 3px 1.1em;
}

.selectbindpathsview .buttons .confirmbtn {
  background: var(--button-primary);
}

.tooltip.attachlabel {
  color: var(--text-color);
  background: rgba(0, 0, 0, 0.75);
  padding: 2px 18px;
  /*font-style: italic;*/
  font-size: small;
  font-family: 'cairo-semibold';
}

/* Tablet stuff */
@media only screen and (max-width: 900px) {
  .selectbindpathsview .buttons {
    top: 0;
    font-size: small;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .selectbindpathsview .buttons {
    top: calc(100% - 70px);
  }
}
.applyposeview {
  display: absolute;
}

.applyposeview .instructions {
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: 15px;
  text-align: center;
  text-shadow: 1px 1px 2px black, 1px 1px 2px black;
  color: var(--text-color);
  width: 100%;
}

.applyposeview .instructions span {
  display: block;
}

.applyposeview .instructions .confirmbtn {
  box-shadow: 1px 4px 8px rgba(0, 0, 0, .7);
  font-size: 1.2em;
}

/* Tablet stuff */
@media only screen and (max-width: 900px) {
  .applyposeview .instructions {
    top: 0;
    font-size: small;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .applyposeview .instructions {
    top: calc(100% - 70px);
  }
}
#managesceneview {
  padding: 5px;
  margin-right: 25px;
  z-index: 1001;
  color: var(--text-color);
  font-size: 1.1em;
  user-select: none;
  -webkit-user-select: none;
  align-self: center;
  margin-left: 8px;
}

#managesceneview a {
  color: var(--text-color);
}
#managesceneview a:hover {
  color: var(--text-color-hover);
}

#managesceneview .dropdown-button {
  background: rgba(20, 19, 19, .75);
  border-radius: 5px;
  padding: 0 15px 0 15px;
  text-align: right;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.4);
}

#managesceneview .dropdown-button .scenename {
  color: var(--text-color-teal);
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  pointer-events: none;
}
#managesceneview .dropdown-button:hover .scenename {
  color: var(--text-color-teal-light);
}

#managesceneview .dropdown-button .fa {
  margin-left: 5px;
}

.managescenedropdown .item {
  width: 130px;
}
.managescenedropdown .item[name="community"] {
  white-space: initial;
  line-height: 1.2;
}
.managescenedropdown .item.disabled {
  color: var(--text-color-disabled);
  cursor: unset;
  background: unset;
}
.managescenedropdown .item.disabled:hover {
  color: var(--text-color-disabled);
  background: unset;
}
.managescenedropdown .item.disabled:active {
  pointer-events: none;
}

#managesceneview .dropdown-items {
  width: max-content;
  font-size: initial;
  overflow: auto;
  overflow-y: auto;
  max-height: 70vh;
  bottom: 2em;
}

#managesceneview .dropdown-items .item {
  text-align: left;
  padding: 5px 15px;
}

#managesceneview .dropdown-items .fa, .far {
  /*width: 25px;*/
}

.newcharactermodal .modal-header {
  text-align: center;
}

.newcharactermodal .fa {
  margin-right: 15px;
  margin-left: 15px;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  #managesceneview {
    margin-right: 0px;
    padding: 0 4px;
  }

  #managesceneview .dropdown-button {
    padding: 0 10px 0 10px;
  }
}

/* Phone */
@media only screen and (max-width: 560px) {
  #managesceneview {
    margin-right: 0px;
  }

  #managesceneview .dropdown-button {
    padding: 0 10px 0 10px;
  }
}
#mysavefilesmodal {
}

#mysavefilesmodal .modal-body {
  overflow-y: auto;
}

#mysavefilesmodal .modal-footer {
  background-color: var(--background-dark);
  padding: 4px 16px;
  overflow: inherit;
}

.savefile {
  /* display: inline-block; */
  /*margin: 15px;*/
  margin: 6px 12px;
  padding: 0px;
  /* width: 150px; */
  /* height: 210px; */
  /* border-radius: 5px; */
  background-color: inherit;
  /* text-align: center; */
  /* background-color: var(--background-dark-semi-trans); */
  align-self: flex-end;
  --outline-inner-color: #0000009c;
  --outline-inner-thickness: 0px;
  --outline-inner-blur: 0px;
}
.savefile.active {
  border-color: rgba(0, 0, 0, 0) !important;
}

.savefile:not(:disabled):hover {
  /* background-color: var(--background-dark); */
  /* cursor: pointer; */
  filter: inherit;
  /* text-align:  center; */
}

.savefileimage {
  /* width: 100%; */
  /* height: 173px; */
  /* width: 250px; */
  /* border-radius: 0; */
}
.savefile.active .savefileimage,
.savefile:not(:disabled):hover .savefileimage {
   filter: brightness(115%);
}
.savefile.active .savefilename,
.savefile:not(:disabled):hover .savefilename {
  color: white;
}

.savefileimage img {
  /*width: 100%;*/
  height: 100%;
  --outline-inner-color: rgba(0, 0, 0, 0);
  filter: brightness(105%)
          drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.75))

          drop-shadow(var(--outline-inner-thickness) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(var(--outline-inner-thickness) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color));
}

.savefile:not(:disabled):hover .savefileimage img {
  --outline-inner-color:
  rgb(0 128 255 / 61%);
  --outline-inner-thickness: 0px;
  --outline-inner-blur: 1px;
}

.savefile:not(:disabled).active .savefileimage img {
  --outline-inner-color: #41c3ff;
  --outline-inner-thickness: 1px;
  --outline-inner-blur: 0px;
}

.savefilename {
  /* text-align: center; */
  /* width: inherit; */
  /* text-overflow: ellipsis; */
  /* white-space: nowrap; */
  /* overflow: hidden; */
  /* display: inline-block; */
  /* margin: 0; */
  /* font-size: 90%; */
  /* font-family: 'cairo-semibold'; */
  color: var(--text-color);
}

#mysavefilesmodal .modal-footer button .fa {
  margin-right: 5px;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  .savefile {
    /* margin: 15px; */
    /* width: 135px; */
    /* height: 189px; */
  }

  .savefileimage {
    /* height: 153px; */
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .savefile {
    /* margin: 10px; */
    /* width: 120px; */
    /* height: 168px; */
  }

  .savefileimage {
    /* height: 133px; */
    /* width: 150px; */
    height: 150px;
  }
}

.downloadstlmodal .title {
  font-size: unset;
  font-family: 'cairo-semibold';
  margin: 0;
}

.downloadstlmodal .modal-content {
  width: 560px;
  color: var(--text-color);
}

.downloadstlmodal .statusdiv {
  background: var(--background-dark);
  padding: 10px 15px;
  border-radius: 10px;
  margin-top: 10px;
}

.downloadstlmodal .status {
  font-family: monospace;
  font-weight: bold;
  font-size: 150%;
  margin-left: 5px;
  margin-right: 5px;
}

.downloadstlmodal .status[type=default] {
  color: inherit;
}
.downloadstlmodal .status[type=error] {
  color: var(--text-color-error);
}
.downloadstlmodal .status[type=preparing] {
  color: var(--text-color-warning);
}
.downloadstlmodal .status[type=downloading] {
  color: var(--text-color-success);
}

.downloadstlmodal .message {
  font-style: italic;
  color: gray;
}

#addcharactermodal {
  /*backdrop-filter: blur(2px);*/
}

#addcharactermodal .modal-content {
  height: 90%;
}

#addcharactermodal .modal-footer {
  background: var(--background-dark);
}

#addcharactermodal .modal-body {
  background: var(--background-dark);
  /* height: 500px; */
  /*max-height: 500px;*/
  overflow-y: hidden;
  border-radius: 4px 4px 0 0;
  background: rgba;
  padding: 6px;
}

#addcharactermodal .tabs > button {
  padding: 4px 20px;
  font-size: large;
  color: var(--text-color);
}
#addcharactermodal .tabs > button.active {
  --text-color: white;
}
#addcharactermodal .tabs > button .desktopdisplay {
  margin-left: 4px;
}
#addcharactermodal .tabs > button svg {
  vertical-align: sub;
}


#addcharactermodal .humanoidpresets,
#addcharactermodal .creaturepresets {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

#addcharactermodal .preset {
  margin: 6px 12px;
  padding: 0px;
  align-self: flex-end;
  --outline-inner-color: rgba(0, 0, 0, 0);
  --outline-inner-thickness: 10px;
  --outline-inner-blur: 0px;
  cursor: pointer;
  position: relative;
}

#addcharactermodal .preset .banner {
  position: absolute;
  right: 5px;
  border-radius: 4px;
  top: 20px;
  font-size: small;
  background: #00BCD4;
  color: var(--background-main);
  font-family: 'cairo-bold';
  padding: 2px 8px;
  line-height: 1;
}

#addcharactermodal .preset img {
  height: 250px;
  width: auto;
  filter: drop-shadow(0px 0px var(--outline-inner-thickness) rgba(0, 0, 0, 0.6))
          drop-shadow(var(--outline-inner-thickness) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(var(--outline-inner-thickness) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
}

#addcharactermodal .preset:hover img {
  --outline-inner-color:
  rgb(0 128 255 / 61%);
  --outline-inner-thickness: 0px;
  --outline-inner-blur: 1px;
}

#addcharactermodal .preset.active img {
  --outline-inner-color: #41c3ff;
  --outline-inner-thickness: 1px;
  --outline-inner-blur: 0px;
}







#addcharactermodal #addcharactermycharacterstab {
  text-align: center;
  overflow-y: auto;
}

#addcharactermodal #addcharactermycharacterstab .savefiles {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

#addcharactermodal #addcharactermycharacterstab .savefile {
  position: relative;
  border-radius: 4px;
  margin: 12px 4px;
  background: var(--background-dark);

  --outline-inner-color: #0000009c;
  --outline-inner-thickness: 0px;
  --outline-inner-blur: 0px;

  filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.75))

          drop-shadow(var(--outline-inner-thickness) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(var(--outline-inner-thickness) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color));
}
#addcharactermodal #addcharactermycharacterstab .savefile:hover {
  --outline-inner-color: rgb(0 128 255 / 61%);
  --outline-inner-thickness: 0px;
  --outline-inner-blur: 1px;
}
#addcharactermodal #addcharactermycharacterstab .savefile.active {
  --outline-inner-color: #41c3ff;
  --outline-inner-thickness: 1px;
  --outline-inner-blur: 0px;
}

#addcharactermodal #addcharactermycharacterstab .savefile {
  width: 200px;
  height: auto;
}

#addcharactermodal #addcharactermycharacterstab .savefile .thumbnail {
  width: 100%;
  height: auto;
  background: linear-gradient(to top, rgb(62 59 60) 20%, rgb(27 27 27) 55%);
}
#addcharactermodal #addcharactermycharacterstab .savefile .thumbnail > img {
  width: 100%;
  height: auto;
  display: block;
  /*filter: contrast(1.1) saturate(1.2);*/
}
#addcharactermodal #addcharactermycharacterstab .savefile .thumbnail > img.shadow {
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.75));
}
#addcharactermodal #addcharactermycharacterstab .savefile .dropdown {
  position: absolute;
  right: 0;
  top: 0;
}
#addcharactermodal #addcharactermycharacterstab .savefile .dropdown-button {
  padding: 4px 12px;
  cursor: pointer;
  color: var(--text-color-brownish);
  display: none;
}
#addcharactermodal #addcharactermycharacterstab .savefile .dropdown-button:hover {
  color: var(--text-color-brownish-light);
}
#addcharactermodal #addcharactermycharacterstab .savefile.active .dropdown-button,
#addcharactermodal #addcharactermycharacterstab .savefile:hover .dropdown-button {
  display: block;
}
.managesavedcharacter.dropdown-items {
  width: 200px;
  white-space: unset;
}



#addcharactermodal #addcharactermycharacterstab .savefile .title {
  text-align: center;
  white-space: nowrap;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

#addcharactermodal #addcharactercommunitylibrarytab {
  text-align: center;
}

#addcharactermodal .communitypresetscontainer {
  overflow-y: auto;
}


#addcharactermodal #addcharactercommunitylibrarytab .loadmorecommunitypresetsbtn {
  margin: 24px;
}


#addcharactermodal #addcharactermycharacterstab .loadmoresavedcharactersbtn {
  margin: 24px;
}

#addcharactermodal #addcharactermycharacterstab .loginmessage {
  margin-top: 40px;
}












#addcharactermodal #addcharacterhumanoidstab,
#addcharactermodal #addcharactercreaturestab,
#addcharactermodal #addcharactermycharacterstab {
  padding: 10px;
  overflow-y: auto;
  text-align: center;
}

#addcharactermodal .confirmbtn:not([disabled]) {
  --pulse-color: rgba(242, 214, 115, 1);
  animation: pulse 2s infinite;
}

#addcharactermodal .noresults {
  margin-top: 24px;
}

#inprogressspecies {
  display: block;
  user-select: text;
  text-align: center;
  color: var(--text-color);
}
#inprogressspecies .species {
  max-width: 700px;
  display: flex;
  flex-wrap: wrap;
  font-size: large;
  justify-content: center;
  font-family: 'cairo-semibold';
  color: white;
  margin: auto;
}
#inprogressspecies .species > div {
  display: block;
  margin: 8px;
}

/* Tablet, mobile landscape mode */
@media only screen and (max-width: 900px) {
  #addcharactermodal .modal-content {
    height: 98%;
    width: 98%;
  }

  #addcharactermodal .modal-body {
    padding: 4px;
    max-height: unset;
  }

  #addcharactermodal .communitypreset {
    width: 150px;
  }


  #addcharactercommunitylibrarytab {
    flex-direction: column;
  }

  #addcharactercommunitylibrarytab .v-divider {
    display: none;
  }

  .communityfilters:not(.modal-body) {
    padding: 8px;
    align-items: baseline;
    flex-shrink: 0;
  }

  .communityfilters:not(.modal-body) {
    display: flex;
    margin: auto;
  }

  .communityfilters .search {
    margin: 0;
  }

  .openfiltersmodal {
    text-align: right;
    display: block;
    font-size: small;
    padding: 4px;
    margin-left: 10px;
  }

  #filtersmodal {
    /*backdrop-filter: unset;*/
    /*background: transparent;*/
  }

  #filtersmodal .modal-content {
    margin-right: auto;
    /*box-shadow: 0 0 30px 0 gray;*/
    height: 100vh;
    width: 40vw;
  }

  #filtersmodal .modal-body {
    overflow-y: auto;
    padding: 8px;
    max-height: unset;
  }

  .communitypreset .title {
    font-size: 90%;
    max-width: 100px;
  }

  .communitypreset .stats .usedin,
  .communitypreset .stats .value {
    display: none;
  }

  .communitypreset .stars:hover .fa,
  .communitypreset .stars:hover .far {
    display: unset;
  }
  .communitypreset .stars:not(.active) .fa {
    display: none;
  }
  .communitypreset .stars.active .far {
    display: none;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  #filtersmodal .modal-content {
    margin-right: auto;
    /*box-shadow: 0 0 30px 0 gray;*/
    height: 100vh;
    width: 65vw;
  }

  #addcharactermodal .preset {
    font-size: small;
  }
  #addcharactermodal .preset img {
    /*width: 100px;*/
    height: 150px;
    width: auto;
  }
}

#sharedscenedetailmodal {
  
}

#sharedscenedetailmodal .modal-content {
  max-width: 720px;
  padding: 8px;
}

#sharedscenedetailmodal .modal-body {
  max-height: 300px;
  padding: 20px 20px 6px 20px;
}

#sharedscenedetailmodal .thumbnail {
  margin: auto 8px auto 0;
  border-radius: 3px;
  background: var(--background-dark);
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.55);
}
#sharedscenedetailmodal .thumbnail img {
  display: block;
  filter: brightness(100%)
          saturate(120%)
          contrast(110%)
          drop-shadow(0px 0px 1px rgba(0, 0, 0, 1));
  border-radius: 4px;
  /* box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.25); */
}

#sharedscenedetailmodal .infobox {
  margin-left: 16px;
  user-select: text;
}

#sharedscenedetailmodal .header {
  flex-shrink: 0;
}

#sharedscenedetailmodal .title {
  font-size: x-large;
  line-height: 1.5;
}

#sharedscenedetailmodal .byline {
  font-size: small;
  color: var(--text-color-darker);
  margin-left: 2px;
  font-style: italic;
}

#sharedscenedetailmodal .description {
  padding: 2px 8px 2px 2px;
  line-height: 1.8;
  color: var(--text-color);
  /* max-height: 150px; */
  overflow-y: auto;
}


#sharedscenedetailmodal .stats {
  text-align: right;
  align-self: flex-end;
  margin-right: 4px;
  color: var(--text-color-darker);
  font-size: 91%;
  user-select: none;
}

#sharedscenedetailmodal .stats > div:first-child {
  padding-bottom: 2px;
}

#sharedscenedetailmodal .stars {
  margin-left: 8px;
}

#sharedscenedetailmodal .stars.active {
  color: #ffffa0;
  filter: drop-shadow(0 0 2px rgba(255, 200, 0, 0.75));
  /*filter: drop-shadow(1px 0px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(-1px 0px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(0px 1px 2px rgba(150, 200, 255, 0.4))
          drop-shadow(0px -1px 2px rgba(150, 200, 255, 0.4));*/
}

#sharedscenedetailmodal .report {
  color: var(--text-color-darker);
  font-size: smaller;
  text-align: right;
  vertical-align: top;
  user-select: none;
  transition: 0.3s color ease;
  width: fit-content;
  margin-left: auto;
}
#sharedscenedetailmodal .report:hover {
  color: var(--link-color);
  cursor: pointer;
}

@media only screen and (max-width: 900px) {

}

@media only screen and (max-width: 560px) {
  #sharedscenedetailmodal .sharedscene {
    flex-direction: column;
  }

  #sharedscenedetailmodal .thumbnail {
    margin-bottom: 8px;
  }
}

.reportsharedscenemodal {
  text-align: center;
}

.reportsharedscenemodal .header {
  line-height: 1.5;
}

.reportsharedscenemodal .name {
  margin-top: 4px;
  font-size: x-large;
  font-family: 'cairo-semibold';
  color: var(--text-color-teal-light);
}
.reportsharedscenemodal .byline {
  font-size: smaller;
  color: var(--text-color-teal-light);
}


.reportsharedscenemodal .modal-body > div {
  padding: 6px;
}

.reportsharedscenemodal textarea {
  resize: none;
  outline: none;
  padding: 8px;
  border-radius: 8px;
  font-family: 'cairo';
  width: 90%;
  max-height: 150px;
}

.reportsharedscenemodal .info {
  font-size: smaller;
  margin-top: 8px;
}

.sharescenemodal .modal-content {
  max-width: 750px;
}

.sharescenemodal .modal-body {
  text-align: center;
}

.sharescenemodal .modal-footer {
  background: var(--background-dark);
}

.sharescenemodal .shareablelink {
  /*font-size: 110%;*/
}

.sharescenemodal .copylink {
  padding: 0px 9px;
}

.sharescenemodal .previewimg {
  margin-top: 10px;
  width: 100%;
}

.sharescenemodal .previewimg img {
  width: 100%;
  border-radius: 10px;
  box-shadow: 2px 2px 5px black;
}

.sharescenemodal .socialdiv {
  margin: 5px;
}


.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block
}

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0.5em
}

.resp-sharing-button {
  border-radius: 5px;
  transition: 25ms ease-out;
  padding: 0.5em 0.75em;
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif
}

.resp-sharing-button__icon svg {
  width: 1em;
  height: 1em;
  margin-right: 0.4em;
  vertical-align: top
}

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle
}

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none
}

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none
}

.resp-sharing-button--twitter {
  background-color: #55acee
}

.resp-sharing-button--twitter:hover {
  background-color: #2795e9
}

.resp-sharing-button--pinterest {
  background-color: #bd081c
}

.resp-sharing-button--pinterest:hover {
  background-color: #8c0615
}

.resp-sharing-button--facebook {
  background-color: #3b5998
}

.resp-sharing-button--facebook:hover {
  background-color: #2d4373
}

.resp-sharing-button--tumblr {
  background-color: #35465C
}

.resp-sharing-button--tumblr:hover {
  background-color: #222d3c
}

.resp-sharing-button--reddit {
  background-color: #f84300
}

.resp-sharing-button--reddit:hover {
  background-color: #942800
}

.resp-sharing-button--google {
  background-color: #dd4b39
}

.resp-sharing-button--google:hover {
  background-color: #c23321
}

.resp-sharing-button--linkedin {
  background-color: #0077b5
}

.resp-sharing-button--linkedin:hover {
  background-color: #046293
}

.resp-sharing-button--email {
  background-color: #777
}

.resp-sharing-button--email:hover {
  background-color: #5e5e5e
}

.resp-sharing-button--xing {
  background-color: #1a7576
}

.resp-sharing-button--xing:hover {
  background-color: #114c4c
}

.resp-sharing-button--whatsapp {
  background-color: #25D366
}

.resp-sharing-button--whatsapp:hover {
  background-color: #1da851
}

.resp-sharing-button--hackernews {
background-color: #FF6600
}
.resp-sharing-button--hackernews:hover, .resp-sharing-button--hackernews:focus {   background-color: #FB6200 }

.resp-sharing-button--vk {
  background-color: #507299
}

.resp-sharing-button--vk:hover {
  background-color: #43648c
}

.resp-sharing-button--facebook {
  background-color: #3b5998;
  border-color: #3b5998;
}

.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
  background-color: #2d4373;
  border-color: #2d4373;
}

.resp-sharing-button--twitter {
  background-color: #55acee;
  border-color: #55acee;
}

.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
  background-color: #2795e9;
  border-color: #2795e9;
}

.resp-sharing-button--tumblr {
  background-color: #35465C;
  border-color: #35465C;
}

.resp-sharing-button--tumblr:hover,
.resp-sharing-button--tumblr:active {
  background-color: #222d3c;
  border-color: #222d3c;
}

.resp-sharing-button--pinterest {
  background-color: #bd081c;
  border-color: #bd081c;
}

.resp-sharing-button--pinterest:hover,
.resp-sharing-button--pinterest:active {
  background-color: #8c0615;
  border-color: #8c0615;
}

.resp-sharing-button--reddit {
  background-color: #f84300;
  border-color: #f84300;
}

.resp-sharing-button--reddit:hover,
.resp-sharing-button--reddit:active {
  background-color: #942800;
  border-color: #942800;
}


#addtocart2modal .modal-content {
  max-width: 750px;
  height: 540px;
}
#addtocart2modal .modal-body {
  height: 100%;
  text-align: center;
  padding: 0;
}
#addtocart2modal .modal-header {
  color: var(--text-color);
}

#addtocart2modal .fa {
  margin-right: 2px;
}

#addtocart2modal #selectmainproduct .topinfo {
  color: var(--text-color);
  margin: 28px 0 8px 0
}

#addtocart2modal #selectmainproduct .mainproducts {
  padding: 8px;
}

#addtocart2modal #selectmainproduct .mainproducts {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  /*grid-template-columns: 1fr 1fr;*/
  border-radius: 10px;
}

#addtocart2modal #selectmainproduct .mainproducts button {
  position: relative;
  /*background: transparent;*/
  /*margin: 8px;*/
  padding: 28px;
  transition: none;
  background: var(--background-dark);
  /*width: fit-content;*/
  /*width: 270px;*/
  width: calc(100% - 8px);
  height: fit-content;
  margin: 0 auto;
  border-radius: 8px;
  /*border: 1px solid var(--background-dark);*/
}
#addtocart2modal #selectmainproduct .mainproducts button[name="physicalmini"] {
  grid-column: span 2;
  /*grid-column: 1;*/
}
#addtocart2modal #selectmainproduct .mainproducts button[name="digitalunlock"] {
  grid-column: span 3;
  /*grid-column: 2;*/
}
#addtocart2modal #selectmainproduct .mainproducts button:hover {
  filter: none;
  background: var(--background-teal);
  background: #1a4c65;
}

#addtocart2modal #selectmainproduct .mainproducts button > div {
  display: flex;
  justify-content: center;
}

#addtocart2modal #selectmainproduct .mainproducts img {
  height: 250px;
  width: auto;
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.7));
  display: block;
  margin: auto;
}

/*#addtocart2modal #selectmainproduct .mainproducts button:hover .productname {
  text-decoration: underline;
}*/
/*#addtocart2modal #selectmainproduct .mainproducts button:hover img {
  --outline-inner-color: #1b6eab;
  --outline-inner-thickness: 1px;
  --outline-inner-blur: 0px;
  filter: brightness(110%)
          drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.75))
          drop-shadow(var(--outline-inner-thickness) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) var(--outline-inner-thickness) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(var(--outline-inner-thickness) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
          drop-shadow(calc(var(--outline-inner-thickness)*-1) calc(var(--outline-inner-thickness)*-1) var(--outline-inner-blur) var(--outline-inner-color))
}*/
#addtocart2modal #selectmainproduct .mainproducts .productname {
  font-size: x-large;
  line-height: 1.2;
  margin-top: 18px;
  font-family: 'cairo-semibold';`
}
#addtocart2modal #selectmainproduct .mainproducts .productdescription {
  color: var(--text-color);
  font-style: italic;
  line-height: 1.4;
}
#addtocart2modal #selectmainproduct .mainproducts .productdescription p {
  margin: 0 0 8px 0;
}

#addtocart2modal .addtocartpanel {
  text-align: center;
}
#addtocart2modal .panelbody {
  padding: 0 8px;
}
#addtocart2modal .panelbody .h-divider {
  margin: 0 30px 4px 30px;
}

#addtocart2modal .panelbody .title {
  font-family: 'cairo-bold';
  font-size: large;
  /* text-decoration: underline; */
  margin: 8px 0 0 0;
  color:  var(--text-color);
}

#addtocart2modal .info {
  color: var(--text-color);
  line-height: 1.5;
}

#addtocart2modal .footer {
  background: var(--background-dark);
  /*margin-top: 4px;*/
  border-radius: 0 0 4px 4px;
  padding: 4px 16px;
  text-align: right;
  flex-shrink: 0;
}
#addtocart2modal .footerinfo {
  color: var(--text-color);
  align-self: center;
  margin: 0 8px;
  font-style: italic;
}
#addtocart2modal .footer a,
#addtocart2modal .footer span {
  align-self: center;
  text-decoration: none;
}

#reviewphysicalmini .productimage,
#reviewdigital .productimage {
  width: 225px;
  min-width: 225px;
  margin: 4px;
  align-self: center;
  padding: 8px;
}
#reviewphysicalmini .productimage img,
#reviewdigital .productimage img {
  width: 100%;
  border-radius: 8px;
  display: block;
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.5));
  margin-bottom: 20px;
}
#reviewphysicalmini .productimage img {
  margin-bottom: 60px;
}

#reviewdigital .assetsbreakdowncontainer {
  margin: 8px;
  overflow-y: auto;
  /*border-radius: 4px;*/
}
#reviewdigital .assetsbreakdowncontainer > span {
  text-align: left;
  margin-left: 8px;
  color: var(--text-color-darker);
}
#reviewdigital .assetsbreakdown {
  border: 1px solid var(--background-darker);
  background: rgba(0, 0, 0, 0.15);
}
#reviewdigital .assetsbreakdown .asset {
  padding: 4px;
  z-index: 15;
  overflow: visible;
}
#reviewdigital .assetsbreakdown .asset[data-row="odd"] {
  background: rgba(0, 0, 0, 0.25);
}
#reviewdigital .assetsbreakdown .asset:first-of-type {
  margin-top: 16px;
}
#reviewdigital .assetsbreakdown .thumbnail {
  width: 120px;
  margin: 0 8px 0 16px;
  position: relative;
}

#reviewdigital .assetsbreakdown img {
  width: 60px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -55%);
  position: absolute;
  display: block;
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.75));
  z-index: 16;
}
#reviewdigital .assetsbreakdown .asset[data-row="even"] img {
  left: 65%;
}
#reviewdigital .assetsbreakdown .asset[data-row="odd"] img {
  left: 25%;
}
#reviewdigital .assetsbreakdown .name {
  align-self: center;
  margin: 0 8px;
  color: var(--text-color);
  font-size: large;
}
#reviewdigital .assetsbreakdown .price {
  min-width: 100px;
  text-align: center;
  margin: auto;
}
#reviewdigital .assetsbreakdown .price[data-state="incart"] {
  background: #675112;
  border-radius: 4px;
  /* margin: auto; */
}
#reviewdigital .assetsbreakdown .price[data-state="owned"] {
  background: var(--button-lightblue);
  border-radius: 4px;
}
#reviewdigital .assetsbreakdown .price[data-state="owned"] .fa {
  margin-right: 4px;
}
#reviewdigital .assetsbreakdown .price[data-state="free"] {
  font-style: italic;
}

#reviewdigital .info {
  max-width: 500px;
  margin: 8px auto 8px auto;
}
#reviewdigital .info [data-icon] svg {
  width: 16px;
  margin-right: 2px;
}
#reviewdigital .tabpanel {
  padding: 0;
}
#downloadtype_downloadandunlock .info {
  margin: 0;
  margin: 8px auto 0 0;
  /*padding: 8px 16px;*/
  text-align: left;
  /*background: var(--background-dark);*/
  /*border: 1px solid var(--background-darker);*/
}
#downloadtype_downloadonly .info,
#downloadtype_voucher .info {
  margin: 8px;
  text-align: left;
  vertical-align: center;
  color: var(--text-color-darker);
  border: 1px solid var(--background-darker);
  background: var(--background-dark);
  border-radius: 4px;
  padding: 2px 24px;
}
#downloadtype_downloadonly .info p,
#downloadtype_voucher .info p {
  margin: 14px 8px;
}
#downloadtype_downloadonly .onetimedownloadprice {
  /*font-family: 'cairo-semibold';*/
  font-size: large;
}

#addtocart2modal .downloadtypetabs {
  margin-top: 8px;
  overflow-x: auto;
}

#addtocart2modal .downloadtypetabs button {
  /*background: blue;*/
  color: var(--text-color-dark);
  border-bottom: 2px solid transparent;
  padding: 0 16px;
  white-space: nowrap;
}
#addtocart2modal .downloadtypetabs button.active {
  color: white;
  background: transparent;
  background: linear-gradient(to top, rgb(0 114 187 / 40%) -20%, rgba(0, 0, 0, 0) 100%);
  border-color: #2f9cc9;
}


#reviewphysicalmini .rightpanel {
  /*padding: 8px;*/
  margin: 8px;
  color: var(--text-color);
  text-align: left;
  /*align-self: center;*/
}
#reviewphysicalmini .rightpanel ul {
  margin: 0;
}
#reviewphysicalmini .rightpanel p {
  margin: 8px 0;
}
#reviewphysicalmini .rightpanel p:first-of-type {
  margin-top: 0;
}
#reviewphysicalmini .info {
  margin-top: 24px;
  font-size: small;
}
#reviewphysicalmini .calculatingprice {
  /*font-size: larger;*/
  /*text-align: right;*/
  margin: auto;
  padding: 0 8px;
}

#reviewphysicalmini .header {
  margin-top: 8px;
  margin-left: 8px;
  /*font-size: large;*/
}

#orderphotos {
  /*margin-top: 12px;*/
  display: flex;
  /*flex-wrap: wrap;*/
  overflow-x: auto;
  margin-left: 16px;
}
#orderphotos img {
  border: 1px solid var(--background-dark);
  height: 100%;
  display: block;
  box-sizing: border-box;
  margin-right: 8px;
  border-radius: 4px;
}
#orderphotos img:hover {
  filter: brightness(105%);1
}

#reviewphysicalmini .info {
  background: var(--background-dark);
  padding: 8px 12px;
  border-radius: 8px;
  margin: 6px 0 0 0;
  font-style: italic;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  #addtocart2modal .modal-content {
    height: 85%;
  }
  #addtocart2modal #selectmainproduct .mainproducts button {
    width: unset;
    margin: 2px;
    display: flex;
  }
  #addtocart2modal #selectmainproduct .mainproducts button {

  }
  #addtocart2modal #selectmainproduct .mainproducts button:hover {

  }
  #addtocart2modal #selectmainproduct .mainproducts img {
    height: 100px;
  }

  #reviewphysicalmini .productimage {
    width: 175px;
    min-width: 175px;
  }
  #reviewdigital .productimage {
    width: 125px;
    min-width: 125px;
  }
  #reviewphysicalmini .productimage img,
  #reviewdigital .productimage img {
    margin: 0;
  }

  #reviewdigital .assetsbreakdown .name,
  #reviewdigital .assetsbreakdown .price {
    font-size: small;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  #addtocart2modal .modal-content {
    height: 80%;
  }
  #addtocart2modal #selectmainproduct .mainproducts button {
    width: unset;
    margin: 2px;
    display: block;
  }
  #addtocart2modal #selectmainproduct .mainproducts button {
  }
  #addtocart2modal #selectmainproduct .mainproducts button:hover {

  }
  #addtocart2modal #selectmainproduct .mainproducts img {
    width: 100%;
    height: auto;
  }

  #addtocart2modal .panelbody > .h-container {
    overflow-y: auto;
  }

  #addtocart2modal .panelbody > .h-container {
    flex-direction: column;
  }

  #addtocart2modal #selectmainproduct .topinfo {
    margin-top: 36px;
  }

  #reviewphysicalmini .productimage {
    width: 125px;
    min-width: 125px;
    margin: 0;
    padding: 0;
  }

  #reviewdigital .productimage {
    width: 100px;
    min-width: 100px;
    margin: 0;
    padding: 0;
  }

  #reviewdigital .info {
    margin-left: 8px;
  }
}

#browseassetpacksmodal .modal-content {
  width: 860px;
  max-width: unset;
}
#browseassetpacksmodal .modal-body {
  height: 530px;
  text-align: center;
  padding: 0;
  padding-top: 20px;
}
#browseassetpacksmodal .modal-footer {
  background: var(--background-dark);
}

#browseassetpacksmodal .itemadded {
  font-family: 'cairo-semibold';
  margin-bottom: 12px;
}
#browseassetpacksmodal .header {
  color: var(--text-color);
  padding: 0 60px;
  display: block;
}

#browseassetpacksmodal .browsearea {
  overflow-y: scroll;
}

#browseassetpacksmodal .snoozeoffers {
  font-size: smaller;
  color: var(--text-color-darker);
}





#browseassetpacksmodal .sectionheader {
  color: var(--text-color-aquamarine);
  margin-top: 8px;
  font-style: italic;
}

#browseassetpacksmodal .assetpacks {
  display: grid;
  grid-template-columns: 1fr 1fr;
}


#browseassetpacksmodal .thumbnaildiv {
  width: 200px;
  min-width: 200px;
}
#browseassetpacksmodal .thumbnaildiv img {
  width: 100%;
  filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.2))
          drop-shadow(calc(1px*-1) 1px 1px rgba(0, 0, 0, 0.2))
          drop-shadow(1px calc(1px*-1) 1px rgba(0, 0, 0, 0.2))
          drop-shadow(calc(1px*-1) calc(1px*-1) 1px rgba(0, 0, 0, 0.2));
}

#browseassetpacksmodal .assetpacklisting {
  /*padding: 4px;*/
  text-align: left;
  margin: 8px 8px 12px 8px;
}

#browseassetpacksmodal .assetpacklisting .thumbnaildiv,
#browseassetpacksmodal .assetpacklisting .details {
  margin: 0 6px;
}
#browseassetpacksmodal .assetpacklisting .details {
}

#browseassetpacksmodal .assetpacklisting .title {
  font-size: large;
  font-family: 'cairo-semibold';
  line-height: 1;
}
#browseassetpacksmodal .assetpacklisting .description {
  margin-bottom: 10px;
  line-height: 1.6;
  color: var(--text-color-dark);
}
#browseassetpacksmodal .assetpacklisting .description p {
  display: none;
  margin: 8px 0 0 4px;
}
#browseassetpacksmodal .assetpacklisting .description p:last-of-type {
  display: block;
}
#browseassetpacksmodal .assetpacklisting .description a {
  width: fit-content;
  display: block;
}

#browseassetpacksmodal .assetpacklisting .pricecontainer {
  display: inline;
  white-space: nowrap;
}
#browseassetpacksmodal .assetpacklisting .price {
  color: white;
}
#browseassetpacksmodal .assetpacklisting .price .currency > span {
  vertical-align: top;
}
#browseassetpacksmodal .assetpacklisting .price .whole {
  font-size: 200%;
  line-height: 1.15;
  margin-right: 1px;
}
#browseassetpacksmodal .assetpacklisting .origprice {
  color: var(--text-color-darker);
  vertical-align: bottom;
  margin-left: 4px;
  text-decoration: line-through;
}

#browseassetpacksmodal .assetpacklisting .saletext {
  background: var(--background-maroon);
  padding: 0 12px;
  width: fit-content;
  user-select: none;
  pointer-events: none;
  font-size: 90%;
  /*color: white;*/
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
  white-space: nowrap;
  margin-bottom: 4px;
}

#browseassetpacksmodal .assetpacklisting .addtocartbtn {
  margin: 12px auto 20px 8px;
  display: block;
}






/* Tablet */
@media only screen and (max-width: 900px) {
  #browseassetpacksmodal .modal-content {
    width: 100%;
    max-width: 100%;
  }
  #browseassetpacksmodal .modal-body {
    height: unset;
  }

  #browseassetpacksmodal .thumbnaildiv {
    width: 150px;
    min-width: 150px;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  #browseassetpacksmodal .assetpacks {
    display: grid;
    grid-template-columns: 1fr;
    /*justify-content: center; */
  }

  #browseassetpacksmodal .assetpacklisting {
    margin-top: 12px;
  }
}

.choosemeshentrymodal .modal-header,
.choosemeshentrymodal .modal-footer {
  background: var(--background-main);
}

.choosemeshentrymodal .modal-content {
  max-width: 800px;
  text-align: center;
}

.choosemeshentrymodal .modal-body {
  background: var(--background-dark);
  /*height: 500px;*/
  max-height: 500px;
  overflow-y: auto;
  color: var(--text-color);
}

.choosemeshentrymodal .meshentries {
  display: flex;
  flex-wrap: wrap;
  margin: 10px;
}

.choosemeshentrymodal .meshentryoption {
  background: var(--background-main);
  cursor: pointer;
  padding: 10px;
  width: 130px;
  margin: 4px auto 4px auto;
  border-radius: 10px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  align-items: center;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
}

.choosemeshentrymodal .meshentryoption[disabled] {
  cursor: not-allowed;
}
.choosemeshentrymodal .meshentryoption[disabled] img,
.choosemeshentrymodal .meshentryoption[disabled] .title,
.choosemeshentrymodal .meshentryoption[disabled] .unitprice,
.choosemeshentrymodal .meshentryoption[disabled] .description {
  opacity: 0.5;
}

.choosemeshentrymodal .meshentryoption:not(['disabled']):hover {
  filter: brightness(85%);
}
.choosemeshentrymodal .meshentryoption.active {
  background: #304f67;
}

.choosemeshentrymodal .meshentryoption img {
  width: 100%;
  border-radius: 10px;
}

/* Tablet */
@media only screen and (max-width: 900px) {
  .choosemeshentrymodal .meshentryoption {
    width: 100px;
  }
}

/* Mobile */
@media only screen and (max-width: 560px) {
  .choosemeshentrymodal .meshentryoption {
    width: 100px;
  }
}

#filterassetsmodal .modal-body {
  color: var(--text-color);
  padding: 20px 20px 0 20px;
}

#filterassetsmodal .fa {
  margin-left: 4px;
}

#filterassetsmodal [data-icon] svg {
  margin-right: 2px;
  width: 24px;
  height: 24px;
}

#filterassetsmodal .h-divider {
  margin-top: 8px;
  margin-bottom: 4px;
}

#filterassetsmodal .checkboxbtn {
  display: block;
}

#filterassetsmodal .assetpackscontainer {
  overflow-y: auto;
  max-height: 200px;
  background: var(--background-dark);
  border-radius: 8px;
  padding: 4px 0;
}

#filterassetsmodal .checkboxbtn .title,
#filterassetsmodal .groupingbtn .showhiddenpanelbtn .title {
  text-transform: capitalize;
}
#filterassetsmodal .groupingbtn .checkboxbtn {
  display: inline;
}
#filterassetsmodal .groupingbtn .showhiddenpanelbtn {
  font-size: inherit;
}
#filterassetsmodal .groupingbtn .showhiddenpanelbtn.show {
  display: inline;
}

#filterassetsmodal .limitresultsdiv .checkboxbtn,
#filterassetsmodal .assetpackscontainer .checkboxbtn {
  margin-left: 14px;
}
#filterassetsmodal .assetpackscontainer .grouping .checkboxbtn {
  margin-left: 28px;
}


#animationmodal .modal-content {
  width: unset;
}

#animationmodal .modal-body {
  text-align: center;
  color: var(--text-color);
  padding: 16px 40px;
}

#animationmodal .keyframe .fa {
  margin-right: 4px;
}

#animationmodal .header {
  font-family: 'cairo-bold';
  /*margin-top: 8px;*/
  color: white;
  font-size: large;
}

#animationmodal ol {
  list-style-position: inside;
  text-align: left;
}

#animationmodal input[name="name"] {
  width: 100px;
}


#animationmodal .keyframescontainer {
  max-height: 500px;
  overflow-y: auto;
}

#animationmodal .keyframes {
  margin: auto;
}

#animationmodal .keyframe.template {
  display: none;
}

#animationmodal .keyframe .number {
  color: white;
  padding: 1px 6px;
}
#animationmodal input[type="number"] {
  width: 30px;
  text-align: center;
}
#animationmodal .keyframe .moveupbtn,
#animationmodal .keyframe .movedownbtn {
  background: rgba(0, 0, 0, 0);
  padding: 0;
  margin: 3px 0;
  color: var(--link-color);
  font-size: small;
}
#animationmodal .keyframe .moveupbtn[disabled],
#animationmodal .keyframe .movedownbtn[disabled] {
  color: var(--text-color-disabled);
}

#animationmodal .keyframe .savecheckpointbtn,
#animationmodal .keyframe .skyboxbtn {
  --text-color: white;
  padding: 0 4px 2px 10px;
}
#animationmodal .keyframe .skyboxbtn.active {
  background: var(--background-teal);
}
#animationmodal .keyframe .skyboxbtn svg {
  transform: translate(-3px, 1px);
}

#animationmodal .keyframe .deletebtn {
  vertical-align: middle;
  padding: 0 4px;
}

#animationmodal .addkeyframebtn {
  margin-top: 12px;
}


.animationinputmodal .modal-body {
  color: var(--text-color);
}

.animationinputmodal ol {
  list-style-position: inside;
}
.animationinputmodal ol i {
  color: var(--text-color-teal);
}


/* Chrome, Safari, Edge, Opera */
#animationmodal input::-webkit-outer-spin-button,
#animationmodal input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
#animationmodal input[type=number] {
  -moz-appearance: textfield;
}
#advancedposehelpmodal .modal-content {
  width: 800px;
}

#advancedposehelpmodal #advancedposeinstructions,
#advancedposehelpmodal #keyboardshortcuts {
  background: var(--background-dark);
  padding: 12px;
  border-radius: 20px;
  text-align: left;
}

#advancedposehelpmodal .h-container {
  font-size: small;
  margin-top: 12px;
  font-style: italic;
  color: var(--text-color-darker);
}

#advancedposehelpmodal .h-container div:first-of-type {
  width: 30px;
}

#advancedposehelpmodal th {
  min-width: 150px;
}

#advancedposehelpmodal .showhiddenpanelbtn {
  font-size: large;
}

#configurecustommaterialmodal {

}

#configurecustommaterialmodal .modal-body {
  color: var(--text-color);
  text-align: center;
}

#configurecustommaterialmodal .field {
  margin: 8px;
}

#configurecustommaterialmodal .deletebtn {
  /* padding: 4px; */
  color: var(--text-color);
  background: var(--button-danger);
}
#configurecustommaterialmodal .deletebtn:hover {
  /*color: white;
  background: var(--button-danger);*/
  color: var(--link-color-hover);
}
#configurecustommaterialmodal .deletebtn .fa {
  margin-right: 2px;
}

#main {
  color: var(--text-color);
  text-align: left;
}

.helparticle table {
  margin-left: 10px;
}

.helparticle table th,
.helparticle table td {
  padding: 0 10px;
}

.helparticle table td {
  color: var(--text-color-darker);
  background: var(--background-dark);
}

.helparticle table th:first-of-type,
.helparticle table td:first-of-type {
  text-align: center;
}

.helparticle table td:not(:first-of-type) {
  font-style: italic;
}

.helparticle li {
  margin-top: 7px;
}

.helparticle img {
  width: 100%;
  max-width: 380px;
  display: block;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
  margin: 5px auto;
}

.helparticle h3 {
  color: var(--text-color-aquamarine);
}

.helparticle h3 a {
  font-size: inherit;
  color: inherit;
}
#editbonelimitsmodal {
  background: transparent;
  backdrop-filter: none;
  pointer-events: auto;
  width: fit-content;
  height: fit-content;
  margin-top: 10px;
  margin-left: 50%;
  transform: translateX(-50%);

  font-size: smaller;
}

#editbonelimitsmodal .modal-content {
}

#editbonelimitsmodal .modal-body {
  text-align: center;
  padding: 8px;
}
#editbonelimitsmodal .modal-footer {
  padding: 8px;
}

#editbonelimitsmodal .title {
  color: var(--text-color-teal);
}

#editbonelimitsmodal .line {

}

#editbonelimitsmodal .line > * {
  white-space: nowrap;
  margin: 2px 6px;
}

#editbonelimitsmodal input[type="range"] {
  /*width: 300px;*/
}

#editbonelimitsmodal input[type="number"] {
  width: 30px;
  margin: 0;
  line-height: 1;
}

#editbonelimitsmodal input[type="number"]::-webkit-outer-spin-button,
#editbonelimitsmodal input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
canvas {
  position: absolute;  /* fixes resizing bug that makes canvas ever-bigger */
  background: black;
  cursor: grab;
  z-index: 10;
  -webkit-tap-highlight-color: transparent;
}

canvas.fadein {
  opacity: 0;
  -webkit-transition: opacity 1.0s ease;
  transition: opacity 1.0s ease;
}

/* dat.GUI, make it appear in front of canvas */
.dg.ac {
  z-index: 1000 !important;
}

.setthumbnailmodal {
  /*--thumbnail-width: 300px;
  --thumbnail-height: 300px;*/
  text-align: center;
}

.setthumbnailmodal .modal-content {
  /*height: max(var(--thumbnail-height), 500px);*/
  max-width: 750px;
}

.canvascontainer {
  width: 100%;
  /* height to be set programmatically */
  height: 200px;
  position: relative;
  margin: auto;
}

.setthumbnailmodal canvas {
  z-index: 1;
  pointer-events: auto;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0;
  background: rgba(0, 0, 0, 0.25);
}

.canvascontainer {
  pointer-events: none;
  border: 1px solid rgba(0, 0, 0, 0.5);
}

.canvascontainer {
  /* position: relative; */
}

.setthumbnailmodal .extraoptions {
  padding: 4px;
}

.setthumbnailmodal .extraoptions .h-container {
  align-content: flex-start;
  color: var(--text-color);
}
.setthumbnailmodal .extraoptions input {
  margin: 0 8px;
  align-self: center;
}
.setthumbnailmodal .extraoptions span {
  width: 40px;
  text-align: right;
}

#freeunlockmodal .error {
  margin-top: 8px;
  text-align: center;
}

#freeunlockmodal .headerimg {
  width: 100%;
  box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

.welcomemessagemodal {
}
.welcomemessagemodal h2 {
  margin-top: 8px;
}

.welcomemessagemodal .images {
  max-width: 50%;
  margin: 8px auto;
}
.welcomemessagemodal .images img {
  max-width: 100%;
  height: auto;
  display: block;
  box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.3);
}

.welcomemessagemodal .modal-content {
	max-width: 800px;
	min-width: 300px;
}

.welcomemessagemodal .modal-header {
	justify-content: center;
}

.welcomemessagemodal .modal-body {
	letter-spacing: 0.5px;
  max-height: 450px;
  overflow-y: scroll;
  /*font-size: 90%;*/
  user-select: text;
}

.welcomemessagemodal .modal-footer {
  background: var(--background-dark);
}

.welcomemessagemodal p, li {
  margin-top: 0;
}

.welcomemessagemodal .itemtitle {
	margin-right: 10px;
}

.welcomemessagemodal .hideuntilnext {
  color: gray;
  margin-right: 10px;
  background: none;
}
.welcomemessagemodal .hideuntilnext:hover {
  filter: brightness(120%);
}

.welcomemessagemodal .hideuntilnext input {
  margin-right: 6px;
  transform: translateY(2px);
}

.welcomemessagemodal .helpertext {
  display: block;
  margin-top: 12px;
  line-height: 130%;
  margin-bottom: 5px;
  color: var(--text-color-dark);
  font-size: 90%;
  font-style: italic;
  padding: 12px 8px 8px 8px;
  border-radius: 12px;
  background: var(--background-dark);
}
#deletebuttontoolbar span {
  pointer-events: auto;
  cursor: pointer;
  color: rgb(111, 20, 7);
  font-size: 2em;
  margin: 7px;
  z-index: 1000;
}

#deletebuttontoolbar span:hover {
  filter: brightness(115%);
}

#transferdesktopheromessage {
  /* background: black; */
  font-size: 90%;
  /* text-align:  center; */
  padding: 0 20px;
  width:  fit-content;
  margin:  auto;
  border-radius: 12px;
  color: var(--text-color-darker);
  /* background: #345e54; */
  margin-bottom:  8px;
}

@media only screen and (max-width: 560px) {
}

#loadingscreen .loadingmessage {
  color: #eda37f;
}
.loadingspinner {
  --text-color: #fffde0;
}