abovevtt.css

button[id$='-button'],
button[id$='_button'],
button[id^=peerVideo_],
#combat_tracker > button,
body > button,
#addscene,
.scene button,
#combat_tracker_inside button,
#edit_dialog button:not(.rc-switch),
#edit_scene_form button:not(.rc-switch),
#mega_importer button,
#prewiz td button,
#wizard_popup button,
#aoe_feet
#text_size,
.top_menu button,
.monster_frame > button,
.stp-btn,
.player-actions button,
#add-party,
#reset_round_number,
#zoom_buttons button,
.GameLogEntry_Message__1GoY3 button {
    background-image: -webkit-linear-gradient(top, #fff, #e6e6e6);
    color: #3d3d3d;
    height: 22px;
    margin: 0 2px;
    border-radius: 7px;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
    padding: 2px 8px;
    transition: color 0.3s ease-in-out, background 0.3s ease-in-out, background-color 0.3s ease-in-out, background-image 0.1s ease-in-out;
    border: 1px solid lightgray;
    font-size: 12px;
}

/*Common simple positioning*/
.TLA {
    position: absolute;
    top: 0;
    left: 0;
}
.note-text table{
    width: revert-layer;
}
.top_menu input,
.top_menu select{
    box-sizing: border-box;
}
.top_menu select {
    font-family: Roboto Condensed, Roboto, Helvetica, sans-serif !important;
}
table:is(#combat_area, #combat_area_carousel) .ac{
    position: absolute;
    top: 21px;
    left: 21px;
    width: 18px;
    height: 18px;
}
button[id^=peerVideo_]{
    height: 27px;
}

button#startScreenShare{
    height: 27px;
    background: #fff;
    border: 0px;
    border-radius: 5px;
}

#hide_interface_button{
    display: none;
    position: absolute;
    opacity: 0.1 !important;
    right: 0px;
    top: -30px;
    scale: 0.5;
}
#hide_interface_button:hover {
    scale: 1;
    opacity: 1 !important;
}
body.responsive-enabled div.container,
body.responsive-enabled.burger-ready div.container{
    -webkit-perspective: unset;
    -moz-perspective: unset;
    perspective: unset;
    -webkit-transform: unset; 
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    transform: unset;
}
div#hide_interface_button [data-name]:after {
    position: relative;
    left: unset;
    right: 40px;
    top: 15px;
}
canvas.dice-rolling-panel__container,
#character-tools-target>canvas{
    max-width: calc(100% - var(--sidebar-width, 340px)) !important;
    z-index: 160000 !important;
    visibility: visible;
}
.hide-button.active{
    color: #fff;
    background-color: #c53131;
}
#hidden-scenes-message,
.abovevttTempMessage{
    display:block;
    position:fixed;
    width:400px;
    bottom:10%;
    left:50%;
    font-size:20px;
    transform: translateX(-50%);
    pointer-events:none;
    color:#fff;
    text-shadow: 1px 1px 0px #000, 
        -1px -1px 0px #000, 
        -1px 1px 0px #000, 
        1px -1px 0px #000, 
        0px -1px 0px #000, 
        1px 0px 0px #000, 
        0px 1px 0px #000, 
        -1px 0px 0px #000;
    z-index:10000000000;
    text-align:center;
    text-transform: uppercase;
    font-weight:bold;
}
#hidden-scenes-message{
    background: #000d;
    border-radius:5px;
    width: fit-content;
    max-width: calc(100% - 600px);
    min-width: 400px;
    padding:5px;
}
.percentageLoaded{
    height: 10px;
    position: absolute;
    background: #0F0;
}
#check_chapter_access{
    color: #0376e9;
}
button.daylight {
    position: relative;
    height: 20px;
    width: 20px;
    left: -2px;
    top: 3px;
    border-radius: 3px;
    object-fit: cover;
    background: #fff;
    border: 1px solid #d8e1e8;
    cursor: pointer;
}

button.daylight.active-daylight {
    background: #1b9af0;
}

button.daylight span.material-symbols-outlined {
    font-size: 15px;
    position:relative;
    left: -4px;
}
#loading_overlay {
    position: fixed;
    top: -2%;
    left: -2%;
    width: 104%;
    height: 104%;
    z-index: 170000;
    background-color: #26282a;
}
#loading_overlay_bg {
    background-position: center;
    background-size: cover;
    filter: blur(4px);
    width: 100%;
    height: 100%;
    background-color: #26282a;
    opacity: 0.5;
}
#loading_overlay_bg.dm {
    background-image: url(https://media-waterdeep.cursecdn.com/attachments/0/267/dmg1k.jpg)
}
#loading_overlay_bg.player {
    background-image: url(https://media-waterdeep.cursecdn.com/attachments/0/264/phb1k.jpg)
}

.joindm {
    position: relative;
}

body > div {
  -webkit-user-select: none; 
  -ms-user-select: none; 
  user-select: none; 
}
#monster-stat-block,
.note,
.note-flyout{
  -webkit-user-select: text; 
  -ms-user-select: text; 
  user-select: text; 
}
.above_delete {
    width: 400px;
}
.above_delete2 {
    width: 400px;
    margin-top: 6px;
    margin-bottom: 10px;
}

#cpick{
    display: block;
    margin-left: 27px;
    height: 27px;
}

#combat_tracker_inside button {
    padding: 2px 4px;
}

.party-item-table input.injected-input[disabled] {
    appearance: none !important;
    background: none !important;
    border: none !important;
}
.party-item-table td.item-add-cell{
    min-width: 90px;
}
:is(.note-text, .avtt-stat-block-container) .party-currency .ct-currency-button__currency-item-preview{
    width:16px;
    height:16px;
    position:relative;
    display:inline-block;
}
:is(.note-text, .avtt-stat-block-container) .party-currency {
    display: flex;
    align-items: center;
    justify-content: center;
}
[class*='GameLogEntries'] [class*='Message-Collapsed-Other-Flex'] {
    padding: 8px 10px;
    color: rgb(92, 112, 128);
    background: rgb(245, 248, 250);
    border: 1px solid rgb(206, 217, 224);
    border-radius: 0.75rem 0.75rem 0.75rem 0px;
    width: 100%;
    overflow: hidden;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: row;
    -webkit-box-pack: center;
    justify-content: center;
}

.custom-gamelog-message {
    width: 100%;
    font-size: 14px;
    font-family: Roboto,Helvetica,sans-serif;
    font-weight: 400;
}
button.gamelog-to-everyone-button,
button.set-conditions-button,
button.remove-conditions-button {
    background-color: rgb(255, 255, 255);
    border: 1px solid rgb(206, 217, 224);
    border-image: initial;
    border-radius: 0px 0px 4px 4px;
    padding: 4px 10px;
    text-transform: uppercase;
    font-family: "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 0.7rem;
    line-height: 16px;
    letter-spacing: 0.4px;
    color: #5c7080;
    cursor: pointer;
    float:left;
}

span.flex-wrap-center-chat-message{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
button.gamelog-to-everyone-button:hover {
    border: 1px solid rgb(152, 160, 164);
    background-color: rgb(220, 219, 219);
    color: #33404b;
}

.material-icons.md-10 { font-size: 10px; }
.material-icons.md-12 { font-size: 12px; }
.material-icons.md-14 { font-size: 14px; }
.material-icons.md-16 { font-size: 16px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-32 { font-size: 32px; }
.material-icons.md-small{font-size: 100%;}
.material-icons.md-weight-700 { font-weight: 700; }

.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }

.material-icons.button-icon {
    color: #838383;
    font-size: 18px;
    font-weight: 700;
    margin: -3px -3px;
}



.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading {
    display: flex;
    flex-wrap: wrap;
    font-family: Roboto Condensed,Roboto,Helvetica,sans-serif;
    cursor: pointer;
    color: #838383;
    line-height: 1;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    background-color: #f2f2f2;
    margin: 3px 2px;
    border-radius: 3px;
    padding: 5px 7px;
    white-space: nowrap;
}

button .ddbc-tab-options__header-heading{
    background-image: unset;
}
button .ddbc-tab-options__header-heading .menu-option{
    width: 69px;
}

.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading--is-active {
    color: #fff;
    background-color: #c53131;
}

.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading svg path {
    fill: #838383
}
.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading--is-active svg path {
    fill: #fff;
}

#select_locked.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading--is-active svg .st1{
    fill: #fff;
}
.ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading svg{
    padding: 0px 0px 0px 1px;
}
#ping_center .ddbc-tab-options__header-heading{
    width: 26px;
    height: 24px;
}
.menu-subtitle {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: Roboto Condensed,Roboto,Helvetica,sans-serif;
    padding: 5px 0;
}
.wall-input{
    padding:0px;
}
.top_menu {
    margin: 0 8px;
    top: 30px !important;
    border-radius: 5px;
    max-height: 0;
    overflow: hidden;
    transition: all 0.4s ease-in-out;
    text-align: center;
}

.top_menu.visible {
    max-height: 100%;
    border: solid black 1px;
    overflow: hidden auto;
    height: fit-content;
    max-height: calc(100% - 100px);
}
span.button-text{
    width:fit-content;
    display:block;
    position:relative;
    margin:0;
    padding:0;
}
.body-rpgcharacter-sheet div.avtt-sidebar-controls {
    margin: 4px 0px 0px 0px !important;
}
.avtt-spectator-sheet div.avtt-sidebar-controls {
    margin: 3px 0px 0px 0px !important;
}
.ct-character-sheet--dark-mode .ct-sidebar__inner div[class*='styles_content'] #chat-text {
    color: #bfccd6;
    background: #313739;
}
.ct-character-sheet--dark-mode .ct-sidebar__inner div[class*='styles_content'] .dice-roller img {
    filter: invert(0.6) sepia(1) saturate(0.5) hue-rotate(175deg);
}
.ct-character-sheet--dark-mode .ct-sidebar__inner div[class*='styles_content'] .sidebar-panel-content {
    color: black;
}


.sidebar__controls > div button {
    width: 30px;
    font-size: 20px;
    line-height: 19px;
}

#scene_selector_toggle {
    align-items: center;
    margin: 0px;
}
#scene_selector_toggle_pill {
    position: fixed;
    left: 50%;
    transform: translate(-50%, 0);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 75px;
    top: 2px;
    z-index: 125000;
}

#scene_selector_toggle > span {
    transform: rotate(0deg);
    transition: 0.5s ease-in-out;
}

#scene_selector_toggle.menu_opened > span {
    transform: rotate(180deg);
    transition: 0.5s ease-in-out;
}
#sheet {
    border: none;
    position: fixed;
    top: 30px;
    bottom: 0px;
    right: -1030px;
    left: auto;
    width: 1030px;
    height: auto;
    background: #242527;
    z-index: 0;
    
    transition: -webkit-transform ease-in-out 0.5s;
    transform-origin: top;
    transition-delay: 0.1s; /* Needed to calculate the vertical area to shift with translateX */

}
#sheet iframe {
    border: none;
    position: absolute;
    top: 24px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}
#sheet.thin {
    width: 420px;
}
.door-button{
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: absolute;
    left: calc(var(--mid-x) - 10px );
    top: calc(var(--mid-y) - 10px);
    opacity: 0.8;
    transform: scale(Max(1, calc(1 / var(--window-zoom))));
}

.door-button.hiddenDoor,
.body-rpgcharacter-sheet .door-button.secret,
.avtt-spectator-sheet .door-button.secret{
    display:none;
}



.door.background,
.portal.background{
    border: 2px ridge #060606;
    height: 130%;
    width: 100%;
    position: absolute;
}


.door.foreground,
.curtain.foreground,
.teleporter.foreground{
    background: #fff6;
    height: calc(130% - 2px);
    width: calc(100% - 2px);
    left: 1px;
    top: 1px;
    border: 1px solid #000;
    position: absolute;
    transform-origin: left;
    transform: rotateY(0deg);
    transition: 200ms transform 0ms linear;
}

.door-icon{
    width: 15%;
    height: 33%;
    position: absolute;
    top: 34%;
    left: 74%;  
}
.teleporter.background,
.teleporter.foreground{
    border:none;
    border-radius: 50%;
    background: linear-gradient(#fff6, #fff6);
    box-shadow: 0px 0px 2px 0px #000;
}
.linked .teleporter.background,
.linked .teleporter.foreground{
    background: linear-gradient(#fff6, #fff6), radial-gradient(ellipse at center, #00F 20%, transparent);
    box-shadow: 0px 0px 5px 0px #00F;
}
.linked:hover .teleporter.foreground{
    background: linear-gradient(#fff6, #fff6), radial-gradient(ellipse at center, #00F 20%, transparent);
    box-shadow: 0px 0px 5px 0px #00F, inset 0px 0px 5px 2px #7c98ff;
}
.curtain.foreground{
  --s: 2.2px; /* control the wave*/
  border:none !important;
  color: #fff;
  --_s: calc(var(--s)*4) 51% repeat-x;
  --_r: calc(1.4*var(--s)) at left 50%;
  --_g1: #000 99%,#0000 101%;
  --_g2: #0000 99%,#000 101%;
  --mask:
    radial-gradient(var(--_r) top    calc(var(--s)* 1.9),var(--_g1)) 
     calc(100% - 2*var(--s) - var(--_i,0px)) 0/var(--_s),
    radial-gradient(var(--_r) top    calc(var(--s)*-0.9),var(--_g2)) 
     calc(100% - var(--_i,0px)) var(--s)/var(--_s),
    radial-gradient(var(--_r) bottom calc(var(--s)* 1.9),var(--_g1)) 
     calc(-40% - 2*var(--s) + var(--_i,0px)) 100%/var(--_s),
    radial-gradient(var(--_r) bottom calc(var(--s)*-0.9),var(--_g2)) 
     calc(-40% + var(--_i,0px)) calc(100% - var(--s))/var(--_s);
  -webkit-mask: var(--mask);
          mask: var(--mask);
  background: linear-gradient(to right, #eeeeeeaa 0% 20%, #aaa5a577 50%, #eeeeeeaa 60%, #33333377)
}

.door-button:hover .curtain.foreground{
    background: linear-gradient(to right, #eeeeeeee 0% 20%, #aaa5a5aa 50%, #eeeeeeee 60%, #333333aa)
}


.door-button:hover .portal.foreground{
    background: linear-gradient(#fffc, #fffc), radial-gradient(ellipse at center, #00F 20%, transparent) !important;
}
.door-button:hover .door.foreground{
    background: #fff;
}

.door-button:hover .window.foreground,
.door-button:hover .window.background>div {
    background: #fffc;
}

.door.foreground>div{
    border-radius: 5%;
    width: 15%;
    height: 38%;
    position: absolute;
    top: 37%;
    left: 73%;
    background: #000;
}


.door-button.open .door.foreground{
    transform: rotateY(57deg) skew(0deg, 16deg);
    transition: 200ms transform 0ms linear;
}


.door-button.locked .door-icon{
    content: "";
    display: block;
    background: #0008;
    width: 50%;
    height: 30%;
    position: absolute;
    top: 61%;
    left: 25%;
    border-radius: 0;
    margin: auto;
}
.door-button.locked .door-icon:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    bottom: 100%;
    position: absolute;
    border: 2px solid #0008;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom: 0;
}

.door-button.secret .door-icon:before {
    content: "S";
    font-weight: 600;
    color: #F008;
    display: block;
    font-size: 20px;
    line-height: 18px;
    position: absolute;
}
.door-button.secret .door-icon {
    background: none;
    content: "";
    display: block;
    width: 66%;
    height: 30%;
    position: absolute;
    top: 20%;
    left: 20%;
    border-radius: 0;
    margin: auto;
}
.door-button.secret.locked .door-icon:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    bottom: 100%;
    position: absolute;
    border: 2px solid #0008;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom: 0;
}
.door-button.secret.locked .door-icon:after {
    content: "S";
    font-weight: 600;
    color: #F008;
    display: block;
    font-size: 13px;
    line-height: 18px;
    top: 2px;
    left: 0px;
    position: absolute;
}
.door-button.secret.locked .door-icon{
    content: "";
    display: block;
    background: #0008;
    width: 8px;
    height: 5px;
    position: absolute;
    top: 8px;
    left: 6px;
    border-radius: 0;
    margin: auto;
}
.window.background{
    border: 2px ridge #0a0600c2;
    height: 26px;
    width: 20px;
    position: absolute;
}


.window.foreground{
    background: #fff6;
    height: 13px;
    width: 16px;
    left: 2px;
    top: 1px;
    border: 1px solid #000;
    position: absolute;
}
.window.background>div{
    content: '';
    background: #fff6;
    height: 13px;
    width: 16px;
    transform: translateY(9px);
    border: 1px solid #000;
    position: absolute;
    transition: 200ms transform 0ms linear;
}
.open .window.background>div{
    content: '';
    background: #fff6;
    height: 13px;
    width: 16px;
    top: 0%;
    transform: translateY(1px);
    border: 1px solid #000;
    position: absolute;
    transition: 200ms transform 0ms linear;
}
.door-button.open .curtain.foreground{
    transform: scale(0.5, 1);
    transition: 200ms transform 0ms linear;
}

.door-button:not(.ignore-hover):not(.locked):hover .window.background>div{
    transform: translateY(7px);
    transition: 50ms transform 100ms linear;
}
.door-button.open:not(.ignore-hover):hover .window.background>div{
    transform: translateY(2px);
    transition: 50ms transform 100ms linear;
}

.door-button:not(.ignore-hover):not(.locked):hover .door.foreground{
    transform: rotateY(35deg) skew(0deg, 6deg);
    transition: 50ms transform 100ms linear;
}
.door-button.open:not(.ignore-hover):hover .door.foreground{
    transform: rotateY(45deg) skew(0deg, 10deg);
    transition: 50ms transform 100ms linear;
}

.door-button:not(.ignore-hover):not(.locked):hover .curtain.foreground{
    transform: scale(0.8, 1);
    transition: 50ms transform 100ms linear;
}
.door-button.open:not(.ignore-hover):hover .curtain.foreground{
     transform: scale(0.7, 1);
    transition: 50ms transform 100ms linear;
}



/*for resizable and moveable monsters and sheets in DM view*/

#sheet {
    left: auto;
    right: var(--sidebar-width, 340px);
    display: none;
    position: fixed !important;
    border-radius: 5px; 
    z-index: 10010;
    border: 1px solid gray;  
    top: 28px;
    bottom: auto;
    height: calc(100vh - 50px);
}

#sheet.open {
    display: block !important;  
    transition: none;
    transform: none;
    backdrop-filter: opacity(0);
    cursor: move;
    z-index:  49000;
}

.resizeDragWindow,
#resizeDragMon {
    display: flex;
    left: 271px;
    top: 67px;
    right: auto;
    width: 410px;
    height: 85%;
    position: fixed !important;
    opacity: 1;
    background: #242527;  
    cursor: move;   
    z-index: 100000;
    border-radius: 3px;   
    border: 1px solid gray;
}

.resizeDragWindow.hideDragWindow,
#resizeDragMon.hideMon{
    visibility: hidden;
}
.resize_drag_window{
    background: url(https://www.dndbeyond.com/attachments/0/84/background_texture.png) #f9f9f9;
}


#sheet iframe {
    width: 100%;
    height: calc(100% - 24px) !important;
    border-radius: 0 0 3px 3px;   
}


#resizeDragMon iframe {
    width: 100%;
    height: calc(100% - 23px) !important;
    position: absolute;
    left: 0;
    top: 24px;
    max-height: 100%;
    border-radius: 0px 0px 3px 3px;
}

#resizeDragMon .avtt-stat-block-container {
    margin: 25px 0px 0px 0px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100% !important;
}
#resizeDragMon .avtt-stat-block-container .details-more-info {
    background: #fff;
    width: 100%;
}
#resizeDragMon .avtt-stat-block-container .ability-block__stat{
    width:  16.666666667%;
}

#resizeDragMon .avtt-stat-block-container .ability-block__data{
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#resizeDragMon .avtt-stat-block-container .tooltip-hover{
    -webkit-text-decoration-thickness:1px ; 
    -webkit-text-decoration-style: dotted;  
    text-decoration-thickness:1px ; 
    text-decoration-style: dotted;
}

#resizeDragMon .avtt-stat-block-container :is(.rule-tooltip, .skill-tooltip, .condition-tooltip, .sense-tooltip){
    color: inherit !important;
    font-weight: inherit !important;
    text-decoration-line: underline; 
    -webkit-text-decoration-color: #47d18c;
    text-decoration-color: #47d18c;
}

#resizeDragMon .avtt-stat-block-container .ddbc-creature-block__header{
    margin-top: 10px;
}
#site.body-rpgcharacter #resizeDragMon .avtt-stat-block-container .detail-content > .mon-stat-block {
    padding-top: 0;
    margin-top: 0;
}
#site.body-rpgcharacter #resizeDragMon .avtt-stat-block-container {
    margin: 25px 0px 0px 0px;
}

.open5eMonster .detail-content>div:not(.mon-stat-block):not(.nohide) {
    display:none !important;
}
a.ddbeb-button {
    align-items: center;
    -webkit-appearance: none;
    -o-appearance: none;
    appearance: none;
    background: #fff;
    border: 1px solid #d8e1e8;
    border-radius: 3px;
    color: #1b9af0!important;
    cursor: pointer;
    display: inline-flex;
    font-family: Roboto,Open Sans,Helvetica,sans-serif!important;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    letter-spacing: 1px;
    padding: 0 16px;
    text-transform: uppercase;
}
select#doorTypeSelectUVTT option,
select#doorTypeSelectUVTT{
    text-transform: uppercase;
}
#resizeDragMon iframe {
    z-index: -10000;
}

#resizeDragMon .avtt-stat-block-container iframe {
    z-index: 1;
}



.ui-resizable-handle {
    z-index: 50100 !important;
}

#horizontalMinorAdjustment,
#verticalMinorAdjustment
{
    position:relative;
}

#wizard_popup button#resetMinorVerticalAdjustmentRange,
#wizard_popup button#resetMinorHorizontalAdjustmentRange {
    margin: 0;
    padding: 0;
    position: relative;
    display:inline-block;
}
#avtt-sidebar-resize-handle {
    position: fixed;
    top: 30px;
    right: var(--sidebar-width, 340px);
    width: 6px;
    height: calc(100vh - 30px);
    cursor: ew-resize;
    z-index: 80;
    background: transparent;
}
#avtt-sidebar-resize-handle:hover {
    background: rgba(100, 149, 237, 0.4);
}


.iframeResizeCover {
    z-index:9999999;
    position:absolute;
    width:calc(100% + 200px);
    height:calc(100% + 200px);
    display: block;
    right:-100px;
    bottom:-100px;
    top:-100px;
    left:-100px;
}
.note form .mce-container-body .iframeResizeCover{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width:100%;
    height:100%;
    position: absolute;
}
#exitWizard{
    z-index: 50;
    position: fixed;
    top: 4px;
    font-size: 20px;
    line-height: 17px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    background-color: #c53131;
    background-image: none;
    border: none;
}
#fog_overlay {
    opacity: 0.5;
}
.body-rpgcharacter-sheet #fog_overlay,
.avtt-spectator-sheet #fog_overlay {
    filter: drop-shadow(0px 0px 2px #000) blur(1px); /*fill in fog gaps on player view*/
    opacity: 1;
}
#dragbox,
#rotDragbox {
  position: absolute;
  overflow: visible;
  top: 0;
  left: 0;
  transform-origin: top left;
  transform: scale(var(--scene-scale));
  display: block;
  pointer-events: none;
  z-index: 20;
}
#rotDragbox{
    z-index: 45;
}
#dragbox .drag-box-b {
  stroke: black;
  stroke-width: calc(1.5px / var(--scene-scale) / var(--window-zoom));
  stroke-linecap: square;
  vector-effect: non-scaling-stroke;
  overflow: visible !important;
}
#dragbox .drag-box-w {
  fill: rgba(0, 255, 255, 0.1);
  stroke: white;
  stroke-width: calc(1.5px / var(--scene-scale) / var(--window-zoom));
  stroke-dasharray: calc(4px / var(--scene-scale) / var(--window-zoom)) calc(4px / var(--scene-scale) / var(--window-zoom));
  stroke-linecap: square;
  vector-effect: non-scaling-stroke;
  transition: fill 0.2s;
  overflow: visible !important;
}
#dragbox .sel-box {
  fill: rgba(0, 255, 255, 0.1);
  stroke: white;
  stroke-width: calc(1.5px / var(--scene-scale) / var(--window-zoom));
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}
#rotDragbox .grabber {
  cursor: alias;
  pointer-events: auto;
}

/*adjust grabber scale 1.2 here:*/
#rotDragbox .grabber-icon-r {
  transform: scale(calc(1.2 / var(--scene-scale) / var(--window-zoom))) translate(0px, -25px);
}
#rotDragbox .grabber-icon-c {
  transform: translate(0px, -10px) scale(calc(1.2 / var(--scene-scale)  / var(--window-zoom))) translate(-12.5px, -25px);
}

#fog_overlay,
#draw_overlay_under_fog_darkness,
#draw_overlay{
  pointer-events:none;
}

#elev_overlay{
    opacity: 0.5;
}
#weather_overlay{
    pointer-events:none;
}
#combat_tracker_inside .ui-resizable-s,
#combat_tracker_inside .ui-resizable-se,
#combat_tracker_inside .ui-resizable-sw {
    bottom:-45px;  
    background: none;
    border-width:0px;
}

#combat_tracker_inside .ui-resizable-e,
#combat_tracker_inside .ui-resizable-w {
    height: calc(100% + 45px);  
}


.body-rpgcharacter-sheet #combat_tracker_inside .ui-resizable-s,
.body-rpgcharacter-sheet #combat_tracker_inside .ui-resizable-se,
.body-rpgcharacter-sheet #combat_tracker_inside .ui-resizable-sw,
.avtt-spectator-sheet #combat_tracker_inside .ui-resizable-s,
.avtt-spectator-sheet #combat_tracker_inside .ui-resizable-se,
.avtt-spectator-sheet #combat_tracker_inside .ui-resizable-sw{
    bottom: -35px;
}

.body-rpgcharacter-sheet #combat_tracker_inside .ui-resizable-e,
.body-rpgcharacter-sheet #combat_tracker_inside .ui-resizable-w,  
.avtt-spectator-sheet #combat_tracker_inside .ui-resizable-e,
.avtt-spectator-sheet #combat_tracker_inside .ui-resizable-w  {
    height: 100%;  
}
#combat_tracker_inside #combat_area{
    width: 100%;
}

div#combat_button {
    z-index: 125000;
    position: fixed;
}
.ui-resizable-s{
    background:  transparent;
    border:  none;
}
#combat_tracker{
    width: 0px;
}
ul.context-menu-list.context-menu-root{
    z-index: 100000 !important;
}
#windowContainment{
    height:  100vh;
    width:  100vw;
    pointer-events:  none;
    display:  block !important;
    position:  fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}
#tokenOptionsClickCloseDiv{
    height:  100vh;
    width:  100vw;
    display:  block !important;
    z-index: 58000;
    position:  fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}
.context-menu-flyout {
    display:  block !important;
    z-index: 1000;
    position:  absolute;
    background: #fff;
}



div.top_menu.visible,
.ddbc-tab-options--layout-pill{
    z-index: 125000;
}

#scene_selector{
    z-index: 58000;
}
#combat_footer,
#combat_tracker_inside{
    border-style: solid;
    border-color: #ddd; 
}
#combat_footer{
    border-width: 0px 1px 1px 1px;
    border-radius: 0px 0px 5px 5px; 
    left: -1px;
    right: -1px;
    position: absolute;
}

#combat_footer button{
    flex-grow: 1;   
}
#combat_footer{
    display: flex;   
}
#combat_tracker_inside {
    border-width: 1px 1px 0px 1px;
    border-radius: 5px 5px 0 0;
    width: 250px;
}
#combat_tracker_inside #combat_footer button:last-of-type{
    border-bottom-right-radius: 5px;   
}
#combat_tracker_inside #combat_footer button:first-of-type{
    border-bottom-left-radius: 5px; 
}

.body-rpgcharacter-sheet #combat_tracker_inside,
.avtt-spectator-sheet #combat_tracker_inside{
    border-radius: 5px;
}

#combat_tracker_inside input[readonly],
#combat_tracker_inside input[disabled=disabled],
#combat_tracker_inside input[disabled=disabled]:hover{
    opacity: 1;
    border-style: solid;
}

/*end resizeable*/
#addscene {
    margin: 5px;
}

.scene {
    border-radius: 5px;
    border: 1px solid #3d3d3d;
    width: 172px;
    height: 50px;
    float: left;
    overflow: hidden;
    margin: 5px;
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
#sources-import-main-container .sidebar-panel-loading-indicator{
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}

.sortable_placeholder {
    width: 171px;
    height: 50px;
    border: 1px dashed #3d3d3d !important;
    background-image: -webkit-linear-gradient(270deg, #f7a6a6, #ff7777);
    float: left;
    overflow: hidden;
    display: block;
    margin: 5px;
}

.scene button,
#combat_tracker_inside button,
.top_menu button {
    margin: 0;
    border-radius: 0;
    border: 0;
}

.scene > div:first-of-type {
    padding: 5px;
    max-width: 169px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#splash {
    background: #f8f2d4 url(https://www.dndbeyond.com/content/1-0-1487-0/skins/waterdeep/images/mon-summary/paper-texture.png);
}

div#scene_selector,
#text_controller_inside,
#combat_tracker_inside,
#edit_dialog,
#mega_importer,
#prewiz,
#wizard_popup,
.top_menu,
.elevationLegendDiv {
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
.elevationLegendDiv{
    top: -5px;
    left: -1px;
    position: relative;
    color: #000;
    border: 1px solid #ddd;
    border-radius: 5px;
    border-top: none;
    padding: 8px;
    width: calc(100% + 2px);
}
.elevationLegendDiv .row{
    display: flex;
    flex-direction: row;
}
.elevationLegendDiv .row .row-color{
    height: 20px;
    width: 20px;
    margin-right:5px;
}
#edit_dialog {
    top: 5px;
    right: 0;
    left: 0;
    bottom: 0;
    position: absolute !important;
}
#edit_dialog{
    overflow: auto;
}
#edit_dialog button:not(.rc-switch),
#edit_scene_form button:not(.rc-switch){
    background:none;
    border-radius:5px;

}
#edit_dialog input[type='text']{
    border-radius:5px;
    border: 1px solid #ddd;
    box-shadow:none;
}


input[type="number"][name='darkness_filter_number'],
input[type="number"][name='gridStrokeNumberInput']{
    width:50px;
    font-size:12px;
}
#edit_dialog input::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 4px;
  height: 12px;
  background: #1b9af0;
  cursor: pointer;
  border-radius:7px;
}

#edit_dialog input[type='range']{
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    height:8px !important;
    width:110px !important;
    border-radius:5px;
}

#edit_dialog input{
    outline:none;
}
label[for='grid_line_width'] {
    font-size: 10px;
    position: absolute;
    font-weight: bold;
    top: -7px;
    left: -83px;
    top: -5px;
    left: 71px;
    color: #555;
}

input#grid_line_width {
    position: relative !important;
    top: 5px !important;
    left: 7px;
}

input[name='gridStrokeNumberInput'] {
    position: relative;
    top: 3px;
    left: -57px;
    position: absolute;
    top: 8px;
    left: 170px;
}

.isvideotogglelabel {
    display: inline-block;
    position: absolute;
    width: 80px;
    right: -20px;
    font-size: 11px;
    top: 6px;
    font-size: 9px;
}

button#player_map_is_video_toggle,
button#dm_map_is_video_toggle,
button#gridSubdividedToggle_toggle {
    height: 12px;
    top: -6px;
    color: #555;
}
button#gridSubdividedToggle_toggle{
    top:0px;
    width:60px;
}

button#player_map_is_video_toggle::after,
button#dm_map_is_video_toggle::after,
button#gridSubdividedToggle_toggle::after
 {
    height: 7px;
    width: 7px;
}
#edit_dialog #horizontalMinorAdjustmentInput,
#edit_dialog #verticalMinorAdjustmentInput
{
    width:80% !important;
}
#additionalGridInfo:after{
    width: 10px;
    height: 10px;
    content: "";
    display: inline-block;
    position: relative;
    border-style: solid;
    left: 5px;
    top: 0px;
    border-width: 5px;
    border-color: transparent transparent #888 transparent;
}
#additionalGridInfo{
    margin: 15px 0px 15px 0px;
    font-weight:bold;
}
#additionalGridInfo.closed:after{
    border-color: #888 transparent transparent transparent;
    top: 4px;
}
#additionalGridInfo.closed ~ div{
    display:none;
}
.verticalHex .hideVerticalHex,
.horizontalHex .hideHorizontalHex,
.horizontalHex .hideHex,
.verticalHex .hideHex{
    display:none !important; 
}

#gridType label {
    display: inline-block;
}
#gridType legend{
    font-weight:bold;
    width: initial;
}

#gridType fieldset>div{
    padding:5px;
}
#gridType input{
    margin-left: 10px;
}
#gridType fieldset{
    margin: initial;
    padding: initial;
    border: 1px solid #ddd;
}

button#player_map_is_video_toggle.rc-switch-checked::after,
button#dm_map_is_video_toggle.rc-switch-checked::after {
    left: 33px;
}
button#gridSubdividedToggle_toggle.rc-switch-checked::after{
    left:50px;
}

#show_grid_controls{
    position:relative;
}

#combat_tracker_inside {
    position: fixed;
    top: 67px;
    left: 2px;
    padding-bottom:3px;
    background-image: url('/content/1-0-1487-0/skins/waterdeep/images/mon-summary/paper-texture.png');
}

:is(#combat_area, #combat_area_carousel)button {
    padding: 2px;

}

#combat_area tr[data-current] {
    background-color: lightgreen;
}

#combat_area td:last-of-type {
    text-align: right;
}

#combat_tracker_inside .tracker-list {
    height: calc(100% - 55px);
    overflow-x: hidden;
}
/*combat UI Changes 2*/
#combat_tracker_inside .tracker-list{
    height: calc(100% - 55px);
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
#round_number_label{
    width: calc(100% + 2px);
    left: -1px;
    position: relative;
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}


/*end combat ui changes 2*/

#combat_footer {
    text-align: center;
}

#combat_footer button {
    width: 50px;
    font-size: 10px;
}

#round_number_label {
    font-size: 14px;
    font-weight: 600;
    line-height: 40px;
    vertical-align: middle;
    text-align: center;
}

input.roundNum::-webkit-outer-spin-button,
input.roundNum::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number].roundNum {
  -moz-appearance: textfield;
}

input {
    border: 1px solid #3d3d3d;
}

#scene_properties form > button,
#combat-tracker-settings form>button
 {
    float: right;
    vertical-align: bottom;
    margin-top: 20px;
}
#combat-tracker-settings>#edit_scene_form>div {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    padding: 5px 5px;
}

#combat-tracker-settings>#edit_scene_form>div>div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 2px 5px;
}
#combat-tracker-settings form>div {
    text-transform: uppercase;
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    align-items: center;
}
#combat-tracker-settings h7{
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    flex-grow: 1;
    margin: 4px 6px 2px 2px;
    align-self: center;
    line-height: 20px;
    display: block;
    font-size: 15px;
    text-align: center;
    position: relative;
    margin: 10px 0px;
    border-bottom: 1px solid;
}
#mega_importer {
    width:100%;
    height: calc(100% - 16px);
    top: 15px;
    z-index: 10000;
    position: absolute;
}
.avtt-stat-block-container .detail-content{
    width: 100%;
}
.container.avtt-stat-block-container .detail-content {
    margin-top: 10px;
}
#sources-import-main-container {
    top: 86px;
    right: 390px;
    height: calc(100% - 170px);
    width: calc(100% - 500px);
    position: fixed !important;
    z-index: 99999;
    border: 1px solid #ddd;
    border-radius: 5px;
    min-width: 850px;
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
#sources-import-main-container .sidebar-panel-loading-indicator svg{
    margin: 0px !important;
    height: calc(100% - 35px);
}
#sources-import-main-container .sidebar-panel-loading-indicator{
    top: 5px !important;
    border-radius: 0px 0px 5px 5px !important;
}
#sources-import-iframe {
    top: 8px;
    left: 0;
    height: calc(100% - 8px);
    width: 100%;
    position: absolute;
    border: none;
    border-radius: 0px 0px 5px 5px;
}

#sources-import-main-container .sidebar-panel-loading-indicator {
    height: calc(100% - 8px) !important;
    top: 8px !important;
}
#sources-import-content-container{
    width:100%;
    height:100%;
}

#sources-import-content-container .listing-card__body,
#mega_importer .listing-card__body{
    min-width: 200px;
}

@media (min-width: 728px){
    #sources-import-content-container .card-listing .listing-card,
    #mega_importer .card-listing .listing-card {
        width: 50%;
        min-width: 250px;
    }
    #sources-import-content-container .listing-card__title,
    #mega_importer .listing-card__title{
        font-size: 18px;
    }
}
@media (min-width: 1750px){
    #sources-import-content-container .card-listing .listing-card,
    #mega_importer .card-listing .listing-card
    {
        width: 33.33333%;
    }
    #sources-import-content-container .listing-card__title,
    #mega_importer .listing-card__title{
        font-size: 25px;
    }
}




#mega_importer.source_select {
    display: flex;
}
#mega_importer.source_select #scenes-panel {
    display: none;
}
#mega_importer.source_select #importer_toggles {
    float: left;
    width: unset;
    padding: 20px;
    height: 100%;
    display: block;
}
#mega_importer.source_select #importer_toggles {
    height: 100% !important;
    padding: 5px 10px 0px 0px;
}
#mega_importer.source_select #importer_toggles .back-to-source-select {
    background-image: url(https://www.dndbeyond.com/file-attachments/0/737/chevron-left-green.svg);
    background-repeat: no-repeat;
    display: inline;
    padding: 0px 20px 0px 20px;
    font-weight: 600;
}
#mega_importer.source_select #importer_toggles li.quick-menu-item {
    padding-top: 5px;
}
#mega_importer.source_select #importer_toggles .quick-menu-item-label {
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    border-left: 3px solid transparent;
}
#mega_importer.source_select #importer_toggles .quick-menu-item-tier-1 > .quick-menu-item-label {
    font-weight: 600;
    font-size: 18px;
    padding-bottom: 5px;
    border-bottom: 1px solid #F7F6F5;
}
#mega_importer.source_select #importer_toggles .quick-menu-item-tier-2 > .quick-menu-item-label {
    font-size: 15px;
}
#mega_importer.source_select #importer_toggles .current-source {
    border-left-color: #47D18C;
    padding-left: 5px;
    backdrop-filter: brightness(0.9);
}
#mega_importer.source_select #importer_footer {
    display: none;
}
#mega_importer.source_select .sidebar-scroll-menu {
    overflow: auto;
    height: 100%;
}
#mega_importer.source_select #importer_area {
    overflow: auto;
    width: 100%;
    height: 100%;
    position: relative;
}

#mega_importer.source_select #importer_toggles ~ #importer_area{
    position: relative;
}

.floating-window-title-bar {
    background: #242527;
    height: 25px;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    color: #fff;
    border-style: solid;
    border-width: 1px 1px 0px 1px;
    border-color: gray;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    line-height: 26px;
    text-shadow: 0px 0px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    top: -20px;
    position: absolute;
    width: calc(100% + 2px);
    left: -1px;
    cursor: move;
    z-index: 10;
}


#importer_footer > div.page-number {
    right: 16px !important;
}

#importer_footer{
    bottom: 0px;
    position:absolute;
    padding:5pxc;
}



#importer_footer button:disabled:hover {
    color: #fff;
}

div#template_section {
    margin: 10px 5px;
    font-weight: 600;
}
div#template_section {
    padding-bottom: 5px;
    border-bottom:  1px solid #00000066;
}

div#scene_properties{
    margin: 0 5px;
}

div#scene_properties form > div{
    margin: 5px 0;
}



#importer_toggles {
    display: flex;
    align-items: flex-end;
    padding: .5rem .5rem 0;
    width: 100%;
    position: relative;
    min-width: 200px;
}

#prewiz td {
    padding: 10px;
    font-size: 16px;
    vertical-align: inherit;
}

#prewiz td button {
    width: 150px;
    text-transform: uppercase;
    height: 50px;
}

#wizard_popup {
    font-size: 16px !important;
    padding: 10px;
}

#wizard_popup button {
    display: block;
    margin: 10px auto;
    height: 28px;
    font-size: 16px;
    text-transform: uppercase;
    min-width: 45px;
}

#zoom_buttons {
    position: absolute;
    top: -3px;
    z-index: 125000;
    display: flex;
    flex-direction: row;
}
[class*='styles_controls'] #zoom_buttons svg{
    height: 20px;
    width: 20px;
}
.body-rpgcharacter-sheet #zoom_buttons{
    top: 2px;
}

.condition-lock.material-symbols-outlined {
    position: absolute;
    z-index: 10;
    top: 3px;
    min-width: 18px;
    line-height: 20px;
    display: inline-block;
    height: 20px;
    float: right;
    left: 132px;
}

.condition-lock.material-symbols-outlined:before{
    font-family: "Material Icons", sans-serif !important;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
    content:"\e898"; 
}
.door-open.material-icons:before{
    content:"\eb4f"; 
    padding: 2px 0px;
}
.link.material-icons:before{
    content:"\e157"; 
    padding: 2px 0px;
}
.spatial-audio-off.material-icons:before{
    content:"\ebe8"; 
    padding: 2px 0px;
}
.spatial-tracking.material-icons:before{
    content:"\ebea"; 
    padding: 2px 0px;
}
#tokenOptionsContainer .select-to-speak.material-icons:before{
    font-family: 'Material Symbols Outlined' !important;
    content:"\f7cf";
    padding: 2px 0px;
}
.door-lock.material-icons:before{
    content:"\e897"; 
    padding: 2px 0px;
}

.door-secret.material-icons:before{
    content: "S";
    margin: 0px 0px 0px 2px;
    color: #dc0000;
}

.door-hidden{
    padding: none;
    display:none;
}

.door-hidden.material-icons:before,
.door-hidden.material-icons:hover:before {
    content:"\e76e"; 
    font-family: "Material Icons", sans-serif !important;
}
.material-symbols-outlined.group_remove:before,
.material-symbols-outlined.group_remove:hover:before{
    content:"\e7ad"; 
}
.material-symbols-outlined.group_add:before,
.material-symbols-outlined.group_add:hover:before{
    content:"\e7f0"; 
}
.add-to-ct .material-symbols-outlined:before,
.remove-from-ct .material-symbols-outlined:before{
    left: 10px;
    position:absolute;
    font-size: 20px;
}
.condition-lock.locked.material-symbols-outlined:before,
.condition-lock.material-symbols-outlined:hover:before {
    content:"\e897"; 
}
.condition-lock.locked.material-symbols-outlined:hover:before{
    content:"\e898"; 

}
#hide_rightpanel .ddbc-tab-options__header-heading,
#zoom_buttons .ddbc-tab-options__header-heading {
    padding: 2px;
}
#hide_rightpanel .material-icons.button-icon,
#zoom_buttons .material-icons.button-icon {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
    margin: 0px 2px;
}
.encounter-builder,
.encounter-details,
.release-indicator
{
    scale:0 !important;
    visibility:hidden !important;
    height:0;
    pointer-events: none;
}
#scene_selector {
    position: fixed;
    left: 50%;
    transform: translate(-50%, 0);
    top: 27px;
    max-height: 60vh;
    min-width: 200px;
    width: calc(100vw - 720px);
    max-width: 750px;
    border: solid black 2px;
    overflow: auto;
}

#scene_selector .scene_title {
    cursor: move;
    font-weight: bold;
}

.active_scene {
    box-shadow: 0px 0px 15px -4px #ff7777;
    border: 1px solid #ff7777;
}

.stp-btn {
    width: 100%;
    height: 34px;
}

.token {
    overflow: visible !important;
    border-radius: 50%;
    transition: box-shadow 0.5 ease-in-out;
    z-index: 50;
}
[class*='styles_mobileNav']>div>button[class*='styles_navToggle']{
    display: none;
}
[class*='styles_mobileNav'].visibleMobileNav>div>button[class*='styles_navToggle']{
    display: flex;
}
#adjustments-flyout>div>button.token-wall-poly-button{
    display:none;
}
#adjustments-flyout>div>button.token-wall-poly-button.visible{
    display:block;
}
.hasTooltip::after,
.door-button[data-name]::after {
    content: attr(data-name);
    -webkit-font-smoothing: antialiased;
    margin: 0 auto;
    opacity: 0;
    white-space: nowrap;
    background: rgba(32, 31, 31, 0.699);
    padding: 1px 1px 1px 1px;
    box-sizing: border-box;
    color: #fff;
    border-radius: 2px;
    text-shadow: 0px 1px 1px #000;
    visibility: hidden;
    transition: 0.2s ease-in-out 0.5s;
}

.hasTooltip::after,
.door-button[data-name]::after,
.sidebar-hover-text-flyout{
  pointer-events: none;
}

.tooltip-body {
    overflow-y: auto;
    padding-bottom:55px;
}
.tooltip::after{
    pointer-events:none;
}
.drag-cancelled {
    display: none;
}

.hasTooltip.button-icon{
    position: relative;
}

.hasTooltip.button-icon.point-right span{
    transform: rotate(0turn);
    transition: transform 0.3s ease-in-out;
}

.hasTooltip.button-icon.point-left span{
    transform: rotate(0.5turn);
    transition: transform 0.3s ease-in-out;
}

.hasTooltip.button-icon::after {
    position: absolute;
    z-index: 100;
    left: 50%;
    font-size: 11px;
    top: 140%;
    transform: translate(-50%);
    transition: 0.1s ease-in-out 0.2s;
}

.hasTooltip.VTTToken::after,
.door-button[data-name]::after {
    position: absolute;
    z-index: 4;
    left: 50%;
    font-size: 0.85em;
    font-size: var(--font-size-zoom);
    bottom: -1.2em;
    bottom: calc(-1 * (var(--font-size-zoom) + var(--font-size-zoom) / 1.5));
    transform: translate(-50%);
    pointer-events: none;
}

.door-button[data-name]::after{
    bottom: -100%;
    transform: translate(-50%);
    font-size: 0.85em;
}

.definitelyNotAToken.ui-draggable-disabled>.token-image{
    cursor: default !important;
}

.token>.token-image{
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

.hasTooltip.CTToken::after{
    display:none;
}

.hasTooltip:not(.drawbutton):hover:after,
.door-button[data-name]:hover:after,
.mobileAVTTUI .drawbutton.hasTooltip:hover:after {
    opacity: 1;
    visibility: visible;
    transition: 0.05s ease-in-out 0.4s;
}
#wall_menu [data-desc]::after{
    visibility: hidden;
    opacity: 0;
    content: attr(data-desc);
    pointer-events: none;
    max-width: 310px;
    white-space: pre-wrap;
    position: fixed;
    display: inline-flex;
    transform: translate(58px, -25px);
    background-color: var(--background-color, rgb(249, 249, 249));
    border-radius: 10px;
    padding: 10px;
    transition: 0.0s linear 0.0s;
}
#wall_menu [data-desc]:hover::after{
    opacity: 1;
    visibility: visible;
    transition: 0.1s linear 1s;
}
.drawbutton.hasTooltip{
    position: relative;
}
.drawbutton.hasTooltip:after{
    position:absolute;
    font-size: 12px;
    top: 9px;
    left: 35px;
    transition: none;
}
.hasTooltip.CTToken:hover:after {
    transition: visibility 0s ease-in-out 0s;
}
[class*='GameLogEntries'] p[class*='InfoItem'] {
    margin:0px
}
[class*='GameLogEntries'] p[class*='InfoItem']:first-of-type {
    font-weight:600
}

[class*='GameLogEntries'] [class*='detail__properties']{
padding-bottom: 5px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
}

.labelToken.hasTooltip:after,
.labelToken.hasTooltip:hover:after,
.door-button[data-name][data-always-show-name='true']:hover:after,
.door-button[data-name][data-always-show-name='true']:after{
     content: attr(data-name);
    opacity: 1;
    background: none;
    color: #fff;
    transition: none;
    visibility: visible;
    font-size: 12px;
    bottom: calc(-0.8 * var(--font-size-zoom));
    pointer-events: none;
    --positive-shadow: 1px;
    --negative-shadow: -1px;
    left: auto;
    font-weight: bold;
    transform: scale(calc(1 / var(--window-zoom)));
    text-shadow: 0px 0px 0px #000, 
        var(--negative-shadow) var(--negative-shadow) 0px #000, 
        var(--positive-shadow) var(--negative-shadow) 0px #000, 
        var(--negative-shadow) var(--positive-shadow) 0px #000, 
        var(--positive-shadow) var(--positive-shadow) 0px #000, 
        0px 0px 5px #000;
    pointer-events:none;
}
#portal_config_window{
    min-height: 220px;
    min-width: 475px;
}
#portal_config_window:has(>.minimized){
    min-height:0px;
}
#portal_config_window #addPortal{
    margin:10px 0px;
}
.portal-listing span.connected-portal {
    transition: margin var(--overflow-speed, 800ms) linear 250ms;
    text-overflow: ellipsis;
    display: inline;
    --name-width-overflow: -45px;
    --overflow-speed: 1350ms;
}
.portal-listing span.connected-portal:hover {
    margin-left: var(--name-width-overflow);
}
.portal-listing div.connected-portal-container {
    width: 100%;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: fit-content;
    vertical-align: middle;
    text-align-last: start;
}

.portal-listing{
    background: var(--background-color, #fff);
    left: 0;
    top: -5px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin: 0;
    min-height: 200px;
    width: 100%;
    height: calc(100% - 20px);
    position: relative;
    display: flex;
    overflow: auto;
    align-content: flex-start;
    justify-content: center;
    gap: 2px;
    max-height: calc(100vH - 45px);
}
.portal-listing .portal-show-name {
    margin-right:10px;
}
.portal-listing button.portalButton {
    width: 20px;
    padding: 0px;
    height: 20px;
    vertical-align: middle;
    span.material-symbols-outlined {
        font-size: 16px;
        color: rgb(27, 154, 240);
    }
}

table.portal-table{
    table-layout: fixed;
}
table.portal-table tr.portal-entry:hover {
    background: color-mix(in srgb, #d9eeff 20%, var(--background-color, #d9eeff) 80%);
}

table.portal-table,
table.portal-table :is(td, th){
    border-collapse: collapse;
    border-spacing: 0px;
    border: 6px solid transparent;
}

.portal-entry td {
    display: table-cell;
    align-content: center;
    align-items: center;
    text-align-last: center;
}
.door-button[data-name][data-always-show-name='true']:hover:after, 
.door-button[data-name][data-always-show-name='true']:after{
    transform: translate(-50%);
    left: 50%;
}
.labelToken.notVisible.hasTooltip:after,
.labelToken.notVisible.hasTooltip:hover:after,
.door-button.notVisible[data-name]::after,
.door-button.notVisible[data-name]:hover::after {
    visibility: hidden;
}
#token_map_items .labelToken.hasTooltip:after, 
#token_map_items .labelToken.hasTooltip:hover:after {
    font-size: calc(12px / var(--scene-scale));
    --positive-shadow: calc(1px / var(--scene-scale));
    --negative-shadow: calc(-1px / var(--scene-scale));
    bottom: calc(-36px / var(--scene-scale));
}
#tokens .underDarkness.labelToken.hasTooltip:after,
#tokens .underDarkness.labelToken.hasTooltip:hover:after{
    content:'';
}
#token_map_items .definitelyNotAToken.hasTooltip.VTTToken:not(.labelToken)::after{
    display:none;
}
.dead {
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
}


.dead:before, .dead:after {
    position: absolute;
    content: '';
    background: red;
    display: block;
    width: 100%;
    height: var(--size, 10px);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transition: all 0.5s ease-in-out;
}

.dead:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.ct_dead img{
    filter: saturate(0);
}
#combat_area .hp,
#combat_area .max_hp,
#combat_area td:nth-of-type(4){
    color: #000000dd;
}
.ct_dead .hp,
.ct_dead .max_hp,
.ct_dead td:nth-of-type(4){
    color: #bc0f0f;
}


input.menu-input.acMenuInput[readonly],
input.menu-input.maxHpMenuInput[readonly], 
input.menu-input.hpMenuInput[readonly] {
    filter:brightness(0.7);
    opacity:0.4;   
}

input.menu-input.acMenuInput[readonly]::-moz-selection,
input.menu-input.maxHpMenuInput[readonly]::-moz-selection, 
input.menu-input.hpMenuInput[readonly]::-moz-selection {
    background: none !important;
    color:#000;
}

input.menu-input.acMenuInput[readonly]::selection,
input.menu-input.maxHpMenuInput[readonly]::selection, 
input.menu-input.hpMenuInput[readonly]::selection {
    background: #0000 !important;
    color:#000;
}


input.menu-input.acMenuInput[readonly]:focus,
input.menu-input.maxHpMenuInput[readonly]:focus, 
input.menu-input.hpMenuInput[readonly]:focus  {
    outline:none;
}
#combat_area .ct_dead[data-current][data-target*="characters"]{
    background: none;
}
#combat_area [data-target*="characters"] input:not(.init){
    text-decoration: none;
    background: none;
    border-width: 0;
    pointer-events:none;
}
#combat_area tr:not([data-target*="characters"]) input.hp{
    text-decoration: underline solid 0.5px #1b9af033;
}
#combat_area tr:not([data-target*="characters"]).ct_dead input.hp{
    text-decoration-color: #bc0f0f33;
}

#combat_area tr input:not(.init){
    border-width: 0;
    background: none;
}

#combat_area tr:not([data-target*="characters"]) input.hp:focus{
    text-decoration: underline;
}
#combat_area tr:not([data-target*="characters"]) input:not(.init):focus{
    border-width: 1px;
}


.ct_dead:not([data-target*="characters"]) .delSVG path:not([fill*="none"]){
    fill: #ff4848;
    opacity: 0.7;
}
.ct_dead[data-current]:not([data-target*="characters"]) .delSVG path:not([fill*="none"]){
    fill: #ff4848;
    opacity: 1;
}
#combat_area .ct_dead[data-current] input{
    border-color: #bc0f0f;
}

.ct_dead[data-current]{
    animation:  deadCombatGlow 3s ease-in-out infinite alternate;
}

@keyframes deadCombatGlow{
    0%, 100%{
        box-shadow: inset 0px 0px 25px 0px #bc0f0f;
        filter: saturate(0.7);
    }
    50%{
        box-shadow: inset 0px 0px 25px 2px #bc0f0f;
        filter: saturate(1);
    }
}
@keyframes pingAnimate {
    0%{

        transform: scale(0);
    }
    50%{
        transform: scale(calc(var(--ping-scale)));
    }
    100%{
        transform: scale(0);
    }

}
#combat_tracker {
    position: fixed;
    height: 450px;
    left: 5px;
    top: 67px;
    z-index: 125000;
}
#noty_layout__bottomRight {
    z-index: 128000 !important;
}
.dice-rolling-panel{
    z-index: 130000 !important;
}
div#combat_button{
    top: 40px;
}

.tracker-dm {
    width: 200px;
}

.tracker-player {
    width: 150px;
}

#campaign_banner {
    border: 1px dashed #1b9af0;
    margin-top: 50px;
    margin-bottom: 50px;
    padding: .5rem;
}

#campaign_banner a{
    color: #1b9af0;
}

#patreons {
padding-top:10px;
    font-size: 12px;
    width: 100%;
    height: calc(100% - 320px);
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    left: 50%;
    transform: translateX(-50%);
}

.patreons-title{
    font-size: 11px;
    font-weight:bold;
}

.patron-l0{
    font-weight:bold;
    font-size: 14px;
    color:red;
}

.patron-l1{
    font-weight:bold;
    font-size: 13px;
}

.patron-l2{
    font-weight:bold;
}


.player-card {
    box-shadow: 0 8px 16px -8px rgb(0 0 0 / 40%);
    background: linear-gradient(#e6e6e6, #fff);
    border-radius: 6px;
    margin: 10px;
    padding: 5px;
}

.player-card-header {
    display: flex;
    justify-content: space-between;
}

.player-name {
    font-variant: small-caps;
    font-size: 17px;
    width: 160px;
    flex: 1 1;
}

.player-actions {
    display: flex;
    align-items: center;
}

.player-card-content {
    display: flex;
    margin: 10px 5px;
}

.player-info {
    display: flex;
    width: 100%;
    margin: 0 10px;
}

.player-attributes {
    width: 60px;
    display: flex;
    flex-wrap: wrap;
    max-height: 70px;
    flex-direction: column;
    justify-content: space-between;
}

.player-attribute {
    display: flex;
    align-items: center;
}

.player-attribute > img {
    width: 16px;
    margin-right: 10px;
}

.player-no-attributes {
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
}

.player-conditions {
    max-width: 155px;
    padding-left: 15px;
}

.player-see-more {
    text-align: center;
}

.player-see-more img {
    cursor: pointer;
    width: 20px;
    transition: transform 0.3s ease-in-out;
}

.player-see-more img.reverse {
    transform: rotate(180deg);
}

.player-card-footer {
    display: flex;
    justify-content: space-evenly;
    overflow: hidden;
    max-height: 0px;
    transition: all 0.5s ease-in-out;
}

.player-card-footer.show {
    max-height: 80px;
}

.player-token {
    position: relative;
    border-radius: 50%;
    height: 70px;
}

.player-token img {
    border-radius: 50%;
}

.player-token > div {
    font-size: 10px;
}

.player-token-hp {
    background: #FF7777;
    position: absolute;
    top: 56px;
    left: 1px;
    padding: 0 3px;
}

.player-token-ac {
    position: absolute;
    top: 54px;
    border: 1px solid black;
    background: white;
    border-radius: 50%;
    width: 16px;
    text-align: center;
    left: 51px;
}

.ability_value {
    display: inline-block;
    width: 50px;
    text-align: center;
    position: relative;
    border-radius: 15px 25px 125px 25px/15px 225px 15px 255px;
    height: 60px;
    margin: 10px 0;
}

.ability_name {
    color: #666;
    font-weight: bold;
    font-size: 11px;
}

.ability_modifier {
    font-size: 18px;
    margin-top: -2px;
    font-weight: bold;
}

.ability_score {
    font-weight: bold;
    font-size: 13px;
}

.add-party-container {
    padding: 10px;
    text-align: right;
}

.token.ui-draggable-disabled {
    cursor: default;
}

:is(.token, .folder-item-list) .condition-img {
    padding: 0;
    margin: 0;
    background: #01ffff;
    border: 1px solid black;
    border-radius: 50%;
    display:flex;
}

.token .custom-condition.condition-img {
    background: #F58231;
}

:is(.token, .folder) .note-condition.condition-img {
    background: #e4c700;
}

:is(#combat_area, #combat_area_carousel) .condition-img {
    background: #01ffff;
}

:is(#combat_area, #combat_area_carousel) .custom-condition.condition-img {
    background: #F58231;
}

:is(#combat_area, #combat_area_carousel) .note-condition.condition-img {
    background: #e4c700;
}

:is(#combat_area, #combat_area_carousel) .conditions {
    display:flex;
    position:absolute;
    top: -3px !important;
    height: 20px !important;
    flex-wrap: nowrap;
    left: calc(100% - 99px) !important;
    align-items: center;
    align-content: center;
}

:is(#combat_area, #combat_area_carousel) .conditions div img{
    height:100% !important;
    width:100% !important;
    pointer-events:auto !important;  
    position:relative;

}
:is(#combat_area, #combat_area_carousel) .conditions{
    width: 100px !important;
}
:is(#combat_area, #combat_area_carousel) .conditions>div{
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 14px !important;
    height: 14px !important;
    margin-right:2px;
    border-radius:5px;
    border: 1px solid black;
    align-content: center;
    flex-wrap: nowrap;
}
:is(#combat_area, #combat_area_carousel) .conditions ~ .player-conditionstions {
    display: none;
}
#note.condition-container{
    pointer-events: auto;
}
#note.condition-container{
    pointer-events: auto;
}

.tokenselected::before {
    content: "";
    position: absolute;
    top: calc(-1px * var(--scene-scale, 1));
    left: calc(-1px * var(--scene-scale, 1));
    right: calc(-1px * var(--scene-scale, 1));
    bottom: calc(-1px * var(--scene-scale, 1));
    border: calc(2px * var(--scene-scale, 1)) #c0f3fff5 solid;
    border-radius: calc(2px * var(--scene-scale, 1));
    pointer-events: none;
}
@keyframes march {
  to { background-position: 10px 0, -10px 100%, 0 -10px, 100% 10px; }
}

.door-button.portalHighlight::before {
    top: -2px;
    bottom: -8px;
    left: -2px;
    right: -2px;
    border-radius: 4px;
    border: none;
    background-image: linear-gradient(90deg, #000d 50%, #fffd 50%), linear-gradient(90deg, #000d 50%, #fffd 50%), linear-gradient(0deg, #000d 50%, #fffd 50%), linear-gradient(0deg, #000d 50%, #fffd 50%);
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-size: 5px 2px, 5px 2px, 2px 5px, 2px 5px;
    background-position: 0 0, 0 100%, 0 0, 100% 0;
    animation: march 1s linear infinite;
    pointer-events: none;
    position:absolute;
    content:"";
}
.tokenselected.ui-draggable-disabled::before{
    border: 5px #f7bfbfd5 solid
}

.tokenselected:hover,
.token:focus-within,
.token:active{
    z-index: calc(15000 + var(--z-index-diff)) !important;
}

.ac {
    position: absolute;
}

.token>.ac{
    pointer-events: none;
    font-weight: 900;
    z-index:2;
}

.color-reminder {
    display: inline-block;
    width:85%;
}

.conditions {
    padding: 0;
    margin: 0;
    top: 0;
    position: absolute;
    z-index: 5;
    pointer-events: none;
}

.dnd-condition {
    cursor: pointer;
}

body>[class*='styles_mobileNav']>button{
    display:none;
}


.ct-primary-box [class*='styles_tabs']{
    gap: 0.9rem;
}
.ct-primary-box [class*='styles_tabList'] .ddbc-tab-options__content{

    height: var(--content-height, 560px);
}
.ct-primary-box [class*='styles_tabList'] section{
    height: var(--container-height, 602px);
}
.ct-primary-box [class*='styles_tabList'] section.ct-extras,
.ct-primary-box [class*='styles_tabList'] section.ct-equipment,
.ct-primary-box [class*='styles_tabList'] section.ct-spells{
    height: var(--searchable-height, 602px);
}

   
.ct-character-sheet__inner{
    max-height: calc(100% - 28px);
}
.hpbar {
    z-index: 3;
    background: #fd9696;
    border: 1px solid black;
    border-radius: 5px;
    display: block;
    left: 50%;
    max-width: 100%;
    transform: translateX(-50%);
    width: max-content;
}
.hpbar.tiny-or-smaller{
    border-radius: 2px;
}
.hpbar{
    transition: 250ms transform linear 0ms;
}
.hpbar:focus-within,
.hpbar:hover{
    transform: translateX(-50%) scale(min(max(1, 0.5/var(--window-zoom)), 3));
    transition: 250ms transform linear 500ms;
}

.hpbar.greater-than-10-wide:focus-within,
.hpbar.greater-than-10-wide:hover{
    transform: translateX(-50%);
}
.hpbar.medium:focus-within,
.hpbar.medium:hover{
    transform: translateX(-50%) scale(min(max(1, 1/var(--window-zoom)), 5));
}
.hpbar.smaller-than-medium:focus-within,
.hpbar.smaller-than-medium:hover{
    transform: translateX(-50%) scale(min(max(1, 1.5/var(--window-zoom)), 6));
}

.hpbar input,
.hpbar div{
    float: left;
    height: 100%;
    font-size: var(--font-size);
    line-height: var(--font-size);
    display: flex;
    align-items: center;
}
.hpbar input{
    font-weight: bold;
    background: transparent;
    text-align: center;
    border: 0;
    padding: 0;
    outline: none;
    outline-offset: 0;
    filter: none;
}
[data-id^='/profile'] .hpbar:before {
    opacity: 0;
    pointer-events:none;
    display: flex;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    font-size: var(--font-size);
    font-weight: bold;
    background: #000;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 10%;
    line-height: var(--font-size);
    counter-reset: hp var(--base-hp) temp var(--temp-hp);
    content: 'HP: ' counter(hp) '\aTemp: ' counter(temp);
    z-index: 10000;
    width: fit-content;
    padding: 3px;
    white-space: pre;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: opacity 0s 0s;
}

[data-id^='/profile'] .hpbar:hover:before {
    opacity:1;
    transition: opacity 200ms 400ms;
}
/* Classes for main buttons on campaign page */
.above-vtt-content-div {
    display: inline-block;
    margin-top: 15px;
    border-style: solid;
    border-width: 1px;
    border-color: #1b9af0
}

.above-vtt-right-margin-5px {
    margin-right:5px;
}

.above-vtt-logo {

    display: inline-block;
    margin-left:5px;
    padding-top:15px;
    padding-bottom:15px;
}

.above-vtt-campaignscreen-blue-button {
    color:white;
    background:#1b9af0;
}

.above-vtt-campaignscreen-black-button {
    color:white;
    background:black;
}

.above-vtt-campaignscreen-white-button {
    cursor: pointer;
    color:#1b9af0;
    background:white;
}

.sidebar__inner {
    position: relative;
}

/* .avtt-sidebar-controls, */
.sidebar__controls {
    position: relative;
    margin: 0 !important;
    z-index: 20;
    /* width: 340px; moved to init_ui */
}

/*.sidebar__controls.player {
    left: -206px;
}*/

/* .ct-sidebar__pane-content, */
body .sidebar__pane-content{
    max-width: 600px !important;
    width: var(--sidebar-width, 340px) !important;
}
body:not(.encounter-builder-page) .sidebar__pane-content {
    position: absolute;
    right: 0;
    top: 28px;
    height: calc(100vh - 30px) !important;
}
body .gamelogcontainer .sidebar__pane-content {
    top: 0px !important;
    height: calc(100% - 10px) !important;
}
.ddbc-tab-list__nav-item {
    display: flex;
    border-bottom: 3px solid transparent;
    color: #838383;
    font-size: 14px;
    font-family: Roboto Condensed,Roboto,Helvetica,sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    cursor: pointer;
}
.ddbc-tab-list__nav-item--is-active {
    border-bottom-color: #c53131;
    color: #000;
}
.selected-tab img.ddbc-tab-list__nav-item--is-active,
.selected-tab svg.ddbc-tab-list__nav-item--is-active {
    width: 90%;
    margin: auto;
}
#export_current_scene,
#recover_scenes{
    margin: 0px;
    width: 145%;
    position: relative;
    left: 50%;
    transform: translate(-50%) scale(0.65);
}
#export_current_scene_container,
#recover_scenes_container{
    width: 50%;
    display: inline-block;
    position: relative;
    float: right;
}
#other_export_container button{
    width: 50%;
    vertical-align: middle;
    height: 49px;
    transform: scale(0.8);
    margin: 0px -20px 0px 0px;
}
#other_export_container span{
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 7px;
}
#journal-panel .sidebar-panel-body>ul.folder-item-list{
    height: 100%;
}
.ct-sidebar__inner [class*='styles_pane'] svg[class*='styles_border']{
    display: none !important;
}

.ct-sidebar__inner [class*='styles_gap']{
    border:none;
    height:0px;
}

.avtt-sidebar-controls .tab-btn,
.sidebar__controls .tab-btn {
    background-color: #f2f2f2;
    margin: 0 2px;
    border-radius: 3px 3px 0 0;
    padding: 0;
    border-style: solid;
    border-width: 0;
    border-color: lightgray;
    transition: all 0.2s ease-in-out;
    font-weight: 400;
    height: 100%;
    flex-grow: 1;
}

.avtt-sidebar-controls .tab-btn .sidebar-tab-image > div,
.sidebar__controls .tab-btn .sidebar-tab-image > div {
    width: 100%;
    height: 80%;
    margin: 2px 0 0 0;
    background-color: #838383;
}
.avtt-sidebar-controls .tab-btn.selected-tab .sidebar-tab-image > div,
.sidebar__controls .tab-btn.selected-tab .sidebar-tab-image > div {
    height: 100%;
    margin-top: 0%;
    background-color: #000;
}
.avtt-sidebar-controls .tab-btn .sidebar-tab-image > svg,
.sidebar__controls .tab-btn .sidebar-tab-image > svg {
    width: 100%;
    height: 80%;
    margin: 2px 0 0 0;
    color: #838383;
}
.avtt-sidebar-controls .tab-btn.selected-tab .sidebar-tab-image > svg,
.sidebar__controls .tab-btn.selected-tab .sidebar-tab-image > svg {
    height: 90%;
    margin-top: 2%;
    color: #000;
}

.avtt-sidebar-controls .tab-btn.selected-tab,
.sidebar__controls .tab-btn.selected-tab {
    width: 50px;
}

.avtt-sidebar-controls .tab-btn.selected-tab.blue-tab,
.sidebar__controls .tab-btn.selected-tab.blue-tab {
    background-color: rgb(235, 241, 245);
}

.avtt-sidebar-controls .tab-btn.notification,
.sidebar__controls .tab-btn.notification {
    background-color: var(--player-border-color, #e40712);
}
.avtt-sidebar-controls .tab-btn.notification svg,
.sidebar__controls .tab-btn.notification svg {
    color: white;
}

.avtt-sidebar-controls .tab-btn.leading-edge,
.sidebar__controls .tab-btn.leading-edge {
    margin-left: 0px;
}

.avtt-sidebar-controls .tab-btn.trailing-edge,
.sidebar__controls .tab-btn.trailing-edge {
    margin-right: 0px;
}

.chat-text-wrapper{
    width:100%;
    padding: 0px 20px;
}
#chat-text {
    width: 100%;
    height: 30px;
    border-radius: 5px 5px 5px 0px;
    padding-right: 25px;
}

.highlight-gamelog {
    -webkit-animation: blink 3.0s linear infinite;
    -moz-animation: blink 3.0s linear infinite;
    -ms-animation: blink 3.0s linear infinite;
    -o-animation: blink 3.0s linear infinite;
    animation: blink 3.0s linear infinite;
}

@keyframes blink {
    0% { box-shadow: inset 0 0 10px red; }
    50% { box-shadow: none; }
    100% { box-shadow: inset 0 0 10px red; }
}

@-webkit-keyframes blink {
    0% { box-shadow: inset 0 0 10px red; }
    50% { box-shadow: 0 0 0; }
    100% { box-shadow: inset 0 0 10px red; }
}

.dice-roller {
    display: flex;
    justify-content: space-around;
    width: 320px;
    margin: 10px 0 15px 0;
}

.dice-roller > div {
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    width: 40px;
    height: 40px;
    position: relative;
    display: flex;
    align-items: center;
}

.dice-roller > div:hover:not(.dice-number) {
    transform: translateY(-2px);
}

.dice-roller > div img {
    top: 0;
    transition: all 0.5s ease-in-out;
    position: absolute;
    z-index: 11;
}

/* .dice-roller > div.dice-number img {
    top: -50px;
}

.dice-roller > div input {
    width: 40px;
    opacity: 0;
    z-index: 10;
} */
.dice-badge {
    position: absolute;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
    transition: transform .2s ease-in-out;
    transform: scale(.6);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    pointer-events: none;
    right: -7px;
    top: -10px;
    color: #fff;
    background: #f44336;
    width: 22px;
    height: 22px;
    line-height: 22px;
    font-size: 16px;
}

.roll-button {
    position: absolute;
    bottom: 21px;
    border-radius: 50%;
    width: 40px;
    left: 0;
    height: 40px;
    border: none;
}

input.roll-input-mod::-webkit-inner-spin-button,
input.roll-input-mod::-webkit-outer-spin-button {
  -webkit-appearance: none;
}
body .roll-mod-container input.roll-input-mod[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    text-align:center;
    width: 50%;
    border:none;
    background:#e6e6e6;
    outline: none;
    border: solid #999;
    border-width: 0px 1px 0px 1px;
    border-radius: 0px;
    box-shadow: none;
    padding: 0px;
    transition: none;
}
.roll-mod-container{
    display:none;
    opacity:0;
    transition: all 0.3s ease-in-out;
}
.roll-mod-container.show{
    z-index: 99999999;
    display: flex;
    position: fixed;
    right: calc(3px + var(--sidebar-width, 340px));
    bottom: 5px;
    opacity: 1;
    transition: all 0.3s ease-in-out;
    width: 60px;
    border-radius: 5px;
    flex-direction: row;
}
button.roll-button-mod {
    text-align: center;
    width: 25%;
    border:none;
    height: 17px;
    outline:none;
    transform: translate(0px, 0px);
    background: #e6e6e6;
    padding: 0px 3px;
}
button.roll-button-mod.plus {
    border-radius: 0px 5px 5px 0px
}
button.roll-button-mod.minus {
    border-radius: 5px 0px 0px 5px
}
button.roll-button-mod:is(.dis, .adv) {
    position: absolute;
    bottom: 20px;
    border-radius: 50%;
    left: 40px;
    filter: sepia(0.3) hue-rotate(312deg) saturate(14) drop-shadow(0px 0px 0px #F00);
    width: 20px;
    background: none;
    outline: none;
    border: none;
    height: 20px;
    position: absolute;
    padding: 0px;
}
button.roll-button-mod.adv {
    left: 40px;
    filter: sepia(0.3) hue-rotate(63deg) saturate(8) drop-shadow(0px 0px 0px #0F0);
    bottom: 40px
}
.d-block {
    display: block;
}

.text-center {
    text-align: center;
}

.hidden {
    visibility: hidden;
}
.tokenentryimg {
    width:60px;
    height:60px;
}

.tokenmenuitem {
    float: left;
    width: 33%;
    margin-bottom: 20px;
    position: relative;
}
.tokenmenuitem img {
    position: absolute;
    top:      0;
    left:     0;
    bottom:   0;
    right:    0;
}

.panel-warning {
    font-family: 'Roboto', sans-serif;
    background:#f7a7a3;
    box-shadow: 0 0 15px 5px #ccc;
    border-left: 5px solid #e90c00;
    padding: 8px;
    margin: 8px;
}

#above-vtt-error-message {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    max-height: 100%;
    overflow: auto;
    right: 0;
    width: 60%;
    min-width: 500px;
    font-size: 16px;
    border: 5px solid #d54f4f;
    border-radius: 5px;
    padding: 10px 50px;
    z-index: 1000000000000;
    box-shadow: 2px 2px 5px 0px #000000;
    background: #ffffffcf;
    backdrop-filter: blur(15px);
    left: calc(50% - 160px);
    transform:translateX(-50%);
}
#above-vtt-error-message.small-error{
    width: 10%;
    border-radius:15px;
    top:10px;
    padding:10px;
}
#above-vtt-error-message.small-error p{
    margin:10px
}
#above-vtt-error-message .above-vtt-error-message-header {
    margin: 20px;
    font-size: 24px;
    font-weight: bold;
}
#above-vtt-error-message #error-message-stack {
    padding: 20px;
    background: rgb(92, 112, 128, 10%);
    overflow: scroll;
    position: relative;
}
#above-vtt-error-message h2 {
    text-align: center;
}
#above-vtt-error-message button {
    float: right;
    background-color: #fff;
    border: 1px solid #7f7f7f;
    border-radius: 3px;
    padding: 5px 16px 5px 16px;
    font-family: "Roboto Condensed","Arial Narrow","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-style: normal;
    font-size: 13px;
    line-height: 15px;
    display: flex;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    z-index: 100;
    position: relative;
}
#above-vtt-error-message .github-issue-workaround:before {
    content: "workaround available";
    background-color: #C2E0C6;
    padding: 4px;
    border-radius: 12px;
    margin-right: 4px;
}
#above-vtt-error-message .error-good-news {
    margin: 15px 0 5px 0;
}
#above-vtt-error-message .error-message-buttons {
    margin-top: 15px;
}
#above-vtt-error-message a {
    text-decoration: underline;
}

#journal-control-container {
    display: flex;
    gap: 5px;
    button {
        width: 30px;
        height: 30px;
    }
    .material-icons{
        padding: 1px 0px 0px 0px;
        color:#000;
    }
}

#btn_add_chapter {
    background: none;
    border: 1px solid #7f7f7f;
    border-radius: 5px;
    color: #7f7f7f;
    display: block;
    font-size: 14px;
    font-weight: bold;
    margin: 8px 0 8px auto;
    padding: 8px;
    cursor: pointer;
}

#btn_add_chapter:hover {
    background: #7f7f7f;
    color: #fff
}

.input-add-chapter {
    background: transparent;
    border: none;
    padding: 8px;
    border-bottom: 1px solid #7f7f7f;
}

.input-add-chapter:focus {
    outline: none;
}

.row-add-chapter {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center; 
}
.moveableWindow .note{
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
}
.moveableWindow .note > .note-text {
    overflow: auto;
    height: calc(100% - 68px);
    width: 100%;
    position: relative;
}
.moveableWindow.resize_drag_window:has(>.note){
    overflow:clip;
}
.body-rpgcharacter-sheet .moveableWindow .note > .note-text {
    height: calc(100% - 25px);
}
 .moveableWindow .note > .note-text *{
    overscroll-behavior: auto;
}  

body .note-visibility-toggle-container {
    position:fixed;
    background:#fff;
    flex-wrap: wrap;
    flex-direction: column;
    border-radius:5px;
    padding: 5px;
    display:flex;
    z-index: 100000;
    transform:translateX(-100%);
    border: 1px solid #ddd;
}
.note-visibility-toggle-container .visibility_toggle_row label{
    margin: 1px 10px;
}
.note-list .token-row-button.share span.material-icons {
    font-size: 21px;
}
.avtt-context-background{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    z-index: 10000;
}

.row-chapter {
    display: flex;
    width: 100%;
    align-items: center;
    border-radius: 5px;
    cursor: pointer;
    height:30px;
}
.row-chapter .token-row-button .material-symbols-outlined,
.row-chapter .token-row-button .material-icons,
.note-list .token-row-button .material-symbols-outlined{
    display: flex;
    align-content: center;
    justify-content: center;
    margin: 0px;
    padding: 0px;
}
.note-list .sidebar-list-item-row-item {
    margin-left: 6px;
    width: calc(100% - 12px);
}
.journal-chapter-title:hover {
    text-decoration: underline;
}

.body-rpgcharacter-sheet .note-list button,
.avtt-spectator-sheet .note-list button{
    display: none;
}
.body-rpgcharacter-sheet #journal-panel .folder-item-list,
.avtt-spectator-sheet #journal-panel .folder-item-list {
    padding:0px;
}
.body-rpgcharacter-sheet #journal-panel .note-list,
.avtt-spectator-sheet #journal-panel .note-list{
    padding: 0px 2px 0px 2px;
}

.btn-chapter-icon {
    border: none;
    cursor: pointer;
    width: 30px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background-color: #f2f6f8;
    border-left: 1px solid #d8e1e8;
    margin: -4px 0px -4px 0px;
    position:relative;
    right:-3px;
}
.note-list .sidebar-list-item-row{
    height:36px;
}

.row-chapter .btn-chapter-icon {
    height:36px;
    margin:0px 1px 0px 0px;
    right:0px;
}

.btn-chapter-icon:focus {
    outline: none;
}

.btn-chapter-icon > img {
    width: 20px;
    height: 20px;
}

/* If the journal-chapter is collapsed, hide its children and make its background white */
.collapsed {
    background-color: #fff;
}

.journal-chapter {
    margin: 8px 0;
    border-radius: 5px;
    border: 1px solid #d8e1e8;
}

#journal-panel .folder.collapsed > .note-list,
#journal-panel .folder.collapsed > .folder{
    display: none !important;
}
#journal-panel .folder>.folder{
    transform: scale(0.96);
}

.journal-chapter-title {
    flex: 1;
    font-size: 14px;
    font-weight: bold;
    font-family: Roboto;
    overflow: hidden;
    max-height: 100%;
    text-overflow: ellipsis;
    text-wrap: nowrap;
}

.folderPlaceholder {
    height: 50px;
    background: #ddd;
}

.row-notes-entry {
    display: flex;
    align-items: center;
    flex: 1;
}


#journal-panel .ui-sortable:not(.ui-sortable-disabled) .note-list .sidebar-list-item-row-item{
    height:26px;
}
#journal-panel .ui-sortable:not(.ui-sortable-disabled) .row-chapter{
    height:15px;
    line-height: 14px;
}
#journal-panel .ui-sortable:not(.ui-sortable-disabled) button{
    display:none;
}


.avtt-sidebar-controls button,
.sidebar__controls button{
    font-size: 10px;
}

#splash {
    position: fixed;
    top: 30px;
    transform: translateX(-50%);
    left: 50%;
    margin: auto;
    overflow:auto;
    height: calc(100% - 40px);
    text-align:center;
    z-index: 70001;
    border: 3px solid black;
    border-radius: 8px;
    padding: 10px;
    width:80%;
}

body .tooltip-hover, body .tooltip-hover:hover, body .tooltip-hover:focus, body .tooltip-hover:active, body .tooltip-hover:visited{
    color: var(--compendium-action-tooltip,var(--compendium-default-tooltip,#11884c)) !important
}
body .tooltip-hover.action-tooltip {
    color: var(--compendium-action-tooltip,var(--compendium-default-tooltip,#11884c)) !important
}

body .tooltip-hover.condition-tooltip {
    color: var(--compendium-condition-tooltip,var(--compendium-default-tooltip,#5a8100)) !important
}

body .tooltip-hover.item-tooltip {
    color: var(--compendium-item-tooltip,#774521) !important
}

body .tooltip-hover.lore-tooltip {
    color: var(--compendium-lore-tooltip,#a83e3e) !important
}

body .tooltip-hover.monster-tooltip {
    color: var(--compendium-monster-tooltip,#bc0f0f) !important
}

body .tooltip-hover.magic-item-tooltip {
    color: var(--compendium-magic-item-tooltip,#0f5cbc) !important
}

body .tooltip-hover.rule-tooltip {
    color: var(--compendium-rule-tooltip,#9b740b) !important
}

body .tooltip-hover.sense-tooltip {
    color: var(--compendium-sense-tooltip,var(--compendium-default-tooltip,#a41b96)) !important
}

body .tooltip-hover.spell-tooltip {
    color: var(--compendium-spell-tooltip,#704cd9) !important
}

body .tooltip-hover.skill-tooltip {
    color: var(--compendium-skill-tooltip,var(--compendium-default-tooltip,#11884c)) !important
}

body .tooltip-hover.weapon-properties-tooltip {
    color: var(--compendium-wprop-tooltip,var(--compendium-default-tooltip,#11884c)) !important
}

body .tooltip-hover.vehicle-tooltip {
    color: var(--compendium-vehicle-tooltip,#1b9af0) !important
}
#dmScreenContainer {
    overflow: hidden;
    height: calc(100% - 35px);
    width: calc(100% + 2px);
    left: -1px;
    border: 1px solid #ddd;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 0px 0px 10px 10px;
    padding: 10px;
    position: relative;
    top: -5px;
    background: var(--background-color, #F9F8F3);

    .tooltip-hover:not(.spell-tooltip):not(.monster-tooltip):not(.magic-item-tooltip){
        color: #18623d !important;
        &:hover,
        &:focus,
        &:active,
        &:visited{
            color: #18623d !important;
        }
    }

    .dmScreenheader{
        position: sticky;
        top: 0px;
        background: var(--background-color, #F9F8F3);
        z-index: 10;
        .dmScreenTitle {
            cursor: pointer;
            span {
                font-size: 0.8em;
            }
        }
        .dmScreenPageButtons{
            position: absolute;
            right: 10px;
            top: 5px;
            display:flex;
            align-items: center;
            align-content: center;
            button {
                width: 20px;
                height: 20px;
                background: var(--background-color, #F9F8F3);
                border: 1px solid #ddd;
                border-radius: 3px;
                padding: 0px;
                margin-left: 5px;
                font-size: 14px;
                color: var(--font-color, #000);
            }
        }

    }
    h1{
        font-size: 24px;
    }
    table {
        font-size: 12px;
        tr:nth-child(odd) {
            background-color: #F1EBDD;
        }
        tr:nth-child(even) {
            background-color: #F9F8F3;
        }
    }
    .dmScreenDropdown {
        position: absolute;
        top: 100%;
        left: calc(50% - 125px);
        background: white;
        border: 2px solid rgb(51, 51, 51);
        box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 8px;
        z-index: 1000;
        min-width: 250px;
        .dmScreenDropdownItem {
            padding: 10px 15px;
            cursor: pointer;
            border-bottom: 1px solid rgb(221, 221, 221);
            background-color: rgb(255, 255, 255);
        }
    }
    #dmScreenBlocks {
        overflow: auto;
        height: calc(100% - 26px);
    }
    .dmScreenBlock { 
        h1 {
            font-size: 20px;
        }
        h2 {
            font-size: 16px;
            border-bottom: #D6BE8C solid thin;
        }
        
        &#dmScreenTravel {
            .dmScreenColumns{
                column-width: 400px;
            }
        }
        .dmScreenColumns {
            column-count: auto;
            column-width: 300px;
            column-gap: 20px;
            column-rule: 1px solid #ccc;
        }

        .dmScreenChunk {
            break-inside: avoid;
            margin-bottom: 15px;
            font-size: 12px;
            text-align: left;
        }
        .dmScreenChunkDefinition {
            margin: 5px 0px;
            h3 {
                font-size: 15px;
                border: none;
            }
            hr {
                display: none;
            }
        }
    }
}
#dmScreenContainer .dmScreenColumns>.note-text>.block-send-to-game-log {
    right: -6px;
    top: 10px;
}
#patreons ul li {
    width: 136px;
}

#patreons ul {
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
}


.splashLinkRow div{
    display:inline;
    padding-left:20px;
}


.aura-element {
    position: absolute;
    border-radius: 50%;
    z-index: 19;
    pointer-events: none;
}

.aura-feet label, .aura-color label {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.context-menu-input.aura-feet > label > input[type="text"] {
    display: inline-block;
    width: 70%;
}

.context-menu-item.context-menu-input {
    padding: 0.3em !important;
}

#raycastingCanvas{
    mix-blend-mode:multiply;
    opacity: 0;
}
#exploredCanvas{
    top: 0px;
    left: 0px;
    position: absolute;
    mix-blend-mode: lighten;
    opacity: 0.5; 
    z-index: 23;
    filter: blur(calc(3px / var(--scene-scale)));
}
.alphaNumGrid{
   fill: rgb(255, 255, 255);
   stroke: rgb(0, 0, 0); 
   stroke-width: max(5, var(--stroke-width, 5)); 
   text-decoration: none; 
   stroke-linecap:butt;
   stroke-linejoin:round;
   paint-order:stroke;
   stroke-opacity:1; 
   font-size: max(5px, var(--font-size, 25px));
   text-anchor: middle;
   dominant-baseline: middle;
}
.body-rpgcharacter-sheet #raycastingCanvas,
.avtt-spectator-sheet #raycastingCanvas{
    opacity: 1;
}
.beyond20-quick-roll-tooltip{
    z-index: 120 !important; /*for beyond20 flyouts to be above character sheet*/
}
#outer_light_container{
    mix-blend-mode:lighten;
    opacity:1;
    background:#000;
    filter: blur(calc(3px * var(--scene-scale-conversion, 1)));
}
.ruler-svg-text{
    fill: #000;
    background:#fff;
    border-radius:2px;
    border:1px solid #000;
    position:absolute;
    z-index:20;
    transform: scale(calc(2 / var(--window-zoom)));
    height: 16px;
    font-size: 10px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    transform-origin: top left;
    pointer-events: none;
    z-index:80;
    opacity: var(--svg-text-alpha);
}


.ruler-svg-line,
.ruler-svg-bobbles{
    border-radius:2px;
    position:absolute;
    z-index:80;
    opacity: var(--svg-text-alpha);
    transform: scale(var(--scene-scale));
    transform-origin: top left;
    pointer-events:none;
}

.ruler-svg-bobbles{
     z-index:85;
}
.ruler-svg-line line:nth-child(odd){
    stroke-width: max(2px, calc(2px / var(--window-zoom)));
}

.ruler-svg-line line:nth-child(even){
    stroke-width: max(1px, calc(1px / var(--window-zoom)));
}
.ruler-svg-bobbles circle{
    stroke-width: max(0.5px, calc(0.5px / var(--window-zoom)));
    r: max(1px, calc(1px / var(--window-zoom)));
}





.remote-dice-video{
    display:none;
}
.aura-element-container-clip [id*='vision_'].notVisible,
.door-button.notVisible,
[id^='aura_'].notVisible{
    visibility: hidden;
}
.token.notVisible,
.token.notVisible *{
    visibility: hidden !important; 
    pointer-events: none !important;
}

#conditions-flyout li,
#playerTokenSelectedWarning {
    position: relative;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    padding: 0.2em 0em 0em 2em;
    color: #2f2f2f;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
}
#conditions-flyout li{
    padding: 0em 0em 0em 2em;
}
#conditions-flyout li.markers-icon {
    padding-left: 0.2em;
    margin: 1px 0px;
}
#conditions-flyout li .color-condition {
    width: 75%;
    height: 75%;
    position: absolute;
}
#conditions-flyout li.icon-condition::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 2em;
    font-family: "Material Icons", sans-serif;
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    color: #2980b9;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#conditions-flyout li:hover {
    background-color: rgb(221 221 222) !important;
}

#playerTokenSelectedWarning
{
    color: #738694;
    font-weight: 700;
    text-transform: uppercase;
}

.icon-condition.material-icons:before,
.context-menu-icon.material-icons:before {
    left: -8px !important;
    font-family: "Material Icons", sans-serif !important;
    font-size: 20px !important;
}
#tokenOptionsContainer .material-icons:before,
#adjustments-flyout .material-icons:before {
    left: 9px;
    position: absolute;
    font-size: 20px;
    line-height: 20px;
    font-family: "Material Icons", sans-serif !important;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}
#tokenOptionsContainer .condition-lock.material-symbols-outlined:before {
    left:0px;
}
.advatageHover svg [fill="#b0b7bd"], .advatageHover svg [fill="#242528"]{
    fill: #0F0;
}
.disadvatageHover svg [fill="#b0b7bd"], .advatageHover svg [fill="#242528"]{
    fill: #F00;
}
#tokenOptionsContainer .to-top:before {
    content: "\e25a" !important;
}
#tokenOptionsContainer .to-bottom:before {
    content: "\e258" !important;
}
#tokenOptionsContainer .open-menu:before {
    content: "\e9bd" !important;
}
#tokenOptionsContainer .send-to:before {
    content: "\ea77" !important;
}
.icon-edit:before,
.context-menu-icon-edit:before {
    content: "\e3c9" !important;
}
.icon-delete-red:before,
.context-menu-icon-delete-red:before {
    content: "\e872" !important;
    color: #e40712 !important;
}
.icon-close-red:before,
.context-menu-icon-close-red:before {
    content: "\e5cd" !important;
    color: #e40712 !important;
}
.icon-note:before,
.context-menu-icon-note:before {
    content: "\e745" !important;
}
.icon-person:before,
.context-menu-icon-person:before {
    content: "\e7fd" !important;
}
.add-link:before,
.context-menu-add-link:before {
    content: "\e178" !important;
}
.link-off:before,
.context-menu-link-off:before {
    content: "\e16f" !important;
}
.icon-note-delete:before{
    content: "\e16c" !important;
}
.icon-view-note:before{
    content: "\e873" !important;
}

.icon-person-add:before,
.context-menu-icon-person-add:before {
    content: "\e7fe" !important;
}
.icon-person-remove:before,
.context-menu-icon-person-remove:before {
    content: "\ef66" !important;
}
.icon-view:before,
.context-menu-icon-view:before {
    content: "\f22e" !important;
}
#tokenOptionsContainer .aoe-select-tokens::before, 
#tokenOptionsContainer .context-menu-aoe-select-tokens::before {
    content: "\e9fe" !important;
    font-family: 'Material Symbols Outlined' !important;
}
.icon-add-circle:before,
.context-menu-icon-add-circle:before {
    content: "\e148" !important;
}

.context-menu-icon-hidden {
    border: 1px solid white;
    justify-content: space-between;
}
.note .mce-toolbar-grp.mce-container.mce-panel.mce-first.mce-stack-layout-item[role='group']{
    position: sticky;
    top: 0;
    z-index: 10;
}
.mce-floatpanel{
    z-index: 191000 !important;
}
.mce-container-body:has(>#mce-custom-font-size){
    display:inline-flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    border:none;
    height: 26px;
}
.mce-container:has(>.mce-container-body>#mce-custom-font-size){
    border:none;
    display:inline-block;
}
.icon-condition,
.context-menu-icon-condition {
    margin: 4px;
    border: 1px solid white;
}
#tokenOptionsContainer button.context-menu-icon-hidden:before {
    width: 16px;
    height: 16px;
    line-height: 16px;
    left: 10px;
}
.icon-condition:before,
.context-menu-icon-condition:before {
    width: 1.4em !important;
    margin-left: 0.2em;
}
.markers-icon:after,
.icon-condition:after,
.context-menu-icon-hidden:after,
.context-menu-icon-condition:after,
.context-menu-icon-grouped:after {
    float: right;
    margin-right: 0px;
    font-family: "Material Icons", sans-serif;
    font-size: 20px;
    margin-top: -5px;
    margin-bottom: -10px;
}
.markers-icon:after, 
.icon-condition:after{
    margin:0px;
}
.context-menu-icon-hidden:after,
.context-menu-icon-condition:after,
.context-menu-icon-grouped:after{
    margin-top: 0px;
    position:absolute;
    right:8px;
}
#tokenOptionsContainer button.context-menu-icon-hidden:after {
    margin-top: -2px;
}

.markers-icon.single-active:after,
.icon-condition.single-active:after,
.context-menu-icon-hidden.single-active:after,
.context-menu-icon-grouped.single-active:after,
.context-menu-icon-condition.single-active:after {
    content: "\e876";
}
.markers-icon.all-active:after,
.icon-condition.all-active:after,
.context-menu-icon-hidden.all-active:after,
.context-menu-icon-grouped.all-active:after,
.context-menu-icon-condition.all-active:after {
    content: "\e6b1";
}
.markers-icon.some-active:after,
.icon-condition.some-active:after,
.context-menu-icon-hidden.some-active:after,
.context-menu-icon-grouped.some-active:after,
.context-menu-icon-condition.some-active:after {
    content: "\f1c2";
}
.icon-blinded:before,
.context-menu-icon-blinded:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/blinded.svg);
}
.icon-charmed:before,
.context-menu-icon-charmed:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/charmed.svg);
}
.icon-deafened:before,
.context-menu-icon-deafened:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/deafened.svg);
}
.icon-exhaustion:before,
.context-menu-icon-exhaustion:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/exhaustion.svg);
}
.icon-frightened:before,
.context-menu-icon-frightened:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/frightened.svg);
}
.icon-grappled:before,
.context-menu-icon-grappled:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/grappled.svg);
}
.icon-incapacitated:before,
.context-menu-icon-incapacitated:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/incapacitated.svg);
}
.icon-invisible:before,
.context-menu-icon-invisible:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/invisible.svg);
}
.icon-paralyzed:before,
.context-menu-icon-paralyzed:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/paralyzed.svg);
}
.icon-petrified:before,
.context-menu-icon-petrified:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/petrified.svg);
}
.icon-poisoned:before,
.context-menu-icon-poisoned:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/poisoned.svg);
}
.icon-prone:before,
.context-menu-icon-prone:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/prone.svg);
}
.icon-restrained:before,
.context-menu-icon-restrained:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/restrained.svg);
}
.icon-stunned:before,
.context-menu-icon-stunned:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/stunned.svg);
}
.icon-unconscious:before,
.context-menu-icon-unconscious:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/unconscious.svg);
}
.icon-unconscious:before,
.context-menu-icon-unconscious:before {
    content: url(https://www.dndbeyond.com/content/1-0-1849-0/skins/waterdeep/images/icons/conditions/unconscious.svg);
}

.aoe-button-moveable {
    font-size: 20px !important;
    /* align-items: flex-end; */
}

.floating-combat-text{
    animation: floating-combat-text 2s;
    animation-timing-function: cubic-bezier(0.55, 0.02, 0, 1.57);
    animation-iteration-count: 1;
    transform-origin: center;
    position:absolute;
    font-size: var(--font-size);
    font-weight: bold;
    --plus-shadow: 1px;
    --minus-shadow: -1px;
    filter: none !important;
    text-shadow: var(--plus-shadow) var(--plus-shadow) var(--plus-shadow) #000, 
        var(--minus-shadow) var(--minus-shadow) var(--plus-shadow) #000, 
        var(--minus-shadow) var(--plus-shadow) var(--plus-shadow) #000, 
        var(--plus-shadow) var(--minus-shadow) var(--plus-shadow) #000, 
        0px var(--minus-shadow) var(--plus-shadow) #000, 
        var(--plus-shadow) 0px var(--plus-shadow) #000, 
        var(--minus-shadow) 0px var(--plus-shadow) #000, 
        0px var(--plus-shadow) var(--plus-shadow) #000;
  }

  @keyframes floating-combat-text {
    0% {
      transform: scale(min(max(1, 1/var(--window-zoom)), 5)) translate(-10%, 0%);
      opacity: 0;
    }
    10% {
      opacity: 1;
      transform: scale(min(max(1, 1/var(--window-zoom)), 5)) translate(-10%, calc(-50% * var(--window-zoom)));
    }
    100% {
      transform:  scale(min(max(1, 1/var(--window-zoom)), 5)) translate(-10%, calc(-100% * var(--window-zoom)));
      opacity: 0;
    }
  }

body{
    --floating-heal-color: #5F5;
    --floating-dmg-color: #F55;
}
body.color-blind-avtt {
    --floating-heal-color: #fff455;
}

.floating-combat-text.heal{
    color: var(--floating-heal-color);
}

.floating-combat-text.dmg{
    color: var(--floating-dmg-color)
}

/* AOE BORDERS */
.aoe-border {
    width: 100%;
    background-position-y: bottom;
    height: 100%;
    background-repeat: repeat-x;
    position:absolute;
}

.aoe-border-cone {
    clip-path: polygon(0% 100%, 5% 100%, 50% 10%, 92% 95%, 5% 95%, 0% 100%, 100% 100%, 50% 0%);
    background-color: white;
    animation: mymove 5s infinite alternate ease-in-out ;
    opacity: var(--opacity);
}
.reduceMovement .aoe-border-cone{
    opacity: 0.5;
}
.aoe-border-basic{
    border: white 10px solid;
}

/* END AOE BORDERS */

/* AOE SHAPES */
.aoe-shape-circle {
    border-radius: 50%;
}

.aoe-shape-cone {
    clip-path: polygon(50% 10%, 7% 95%, 92% 95%);
}
/* END AOE SHAPES */

/* AOE STYLES */
.aoe-style-acid{
    background:linear-gradient(rgba(13, 253, 0, 0.49), rgba(13, 253, 0, 0.49)), url(https://opengameart.org/sites/default/files/styles/medium/public/oga-textures/12976/caust_009.png);
    background-repeat: no-repeat, repeat;
}
.aoe-style-bludgeoning{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/bludgeoning.jpg);
}
.aoe-style-default{
    background-image: linear-gradient(rgb(66 0 253 / 49%), rgb(0 29 253 / 49%));
}
.aoe-style-force{
    background-image: url(https://www.myfreetextures.com/wp-content/uploads/2014/10/electbubbles-900x900.jpg);
}
.aoe-style-ice,
.aoe-style-cold {
    background-image: url(https://3djungle.net/upload/resize_cache/iblock/849/400_400_1/8495c4591433cffedbe8a19a13fbc7eb.jpg);
}
.aoe-style-nature{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/nature.jpg);
    filter: brightness(1.2) contrast(1.2);
}
.aoe-style-necrotic {
    background-image: radial-gradient(rgb(132 255 206) 0%, rgb(132 255 206 / 70%) 10%, rgb(0, 0, 0) 100%), radial-gradient(rgb(132 255 206) 0%, rgb(43 167 255) 30%, rgb(0 255 45) 70%, rgb(0 0 0) 100%), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/necrotic.jpg);
    background-blend-mode: screen, color, normal !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.aoe-style-necrotic:not(.aoe-shape-circle){
    background-position: bottom center !important;
    background-size: auto 200% !important;
}
.aoe-style-piercing{
    background-image: url(https://previews.123rf.com/images/sylverarts/sylverarts1801/sylverarts180100741/92992928-horror-style-horrible-seamless-pattern-vector-background-blackthorn-branches-with-thorns-stylish-end.jpg);
}
.aoe-style-poison {
    background:linear-gradient(rgba(119, 247, 0, 0.52), rgba(119, 247, 0, 0.52)), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/poison.jpg);
    background-repeat: no-repeat, repeat;
}
.aoe-style-psychic {
    background: radial-gradient(#9500ff 0%, #ec77ff 50%), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/psychic.jpg), radial-gradient(#00000094 0%, #00000066 100%);
    background-blend-mode: hue, hard-light, normal !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.aoe-style-psychic:not(.aoe-shape-circle){
    background-position: bottom center !important;
    background-size: auto 200% !important;
}
.aoe-style-radiant {
    background-image: radial-gradient(rgb(255 255 255) 6% 20%, rgb(247 255 127 / 64%), rgb(255 131 24 / 27%)), repeating-conic-gradient(from 0deg, transparent 0deg 1deg, #0006 3deg 5deg, transparent 7deg), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/radiant.jpg);
    background-size: contain, contain, 100px !important;
    background-blend-mode: lighten, luminosity, luminosity;
}
.aoe-style-radiant:not(.aoe-shape-circle){
    background-image:radial-gradient(circle at top center, rgb(255 255 255) 6% 20%, rgb(247 255 127 / 64%), rgb(255 131 24 / 27%)), repeating-conic-gradient(from 0deg at top center, transparent 0deg 1deg, #000000c4 3deg 5deg, transparent 7deg), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/radiant.jpg);
}
.aoe-style-thunder{
    background: repeating-radial-gradient(rgb(0 0 0 / 0%) calc(20px * var(--scene-scale, 1)), rgb(0 0 0 / 44%) calc(30px * var(--scene-scale, 1)), rgb(246 246 246 / 47%)  calc(32px * var(--scene-scale, 1)), rgb(0 0 0 / 0%)  calc(35px * var(--scene-scale, 1))), #7d7dff6e;
    background-repeat: no-repeat, repeat !important;
    background-size: contain, 300px !important;
}
.aoe-style-thunder:not(.aoe-shape-circle) {
    background: repeating-radial-gradient(circle at top center, rgb(0 0 0 / 0%) calc(20px * var(--scene-scale, 1)), rgb(0 0 0 / 44%) calc(30px * var(--scene-scale, 1)), rgb(246 246 246 / 47%)  calc(32px * var(--scene-scale, 1)), rgb(0 0 0 / 0%)  calc(35px * var(--scene-scale, 1))), #7d7dff6e;
}
.aoe-style-water{
    background:linear-gradient(rgba(49, 177, 246, 0.49), rgba(49, 177, 246, 0.49)), url(https://opengameart.org/sites/default/files/styles/medium/public/oga-textures/12976/caust_009.png);
    background-repeat: no-repeat, repeat;
}

.aoe-style-darkness{
    filter: grayscale(1) brightness(0.2) !important;
}
.aoe-style-fire{
  background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/fire_background.png);
}
.aoe-style-lightning{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/lightning.png);
}
.aoe-style-slashing{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/slashing.png);
}
.aoe-style-darkness{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/fire_background.png);
}
/* SPECIFIC SPELL STYLES */
.aoe-style-stinking-cloud{
    background:linear-gradient(rgba(49, 246, 85, 0.49), rgba(49, 246, 85, 0.49)), url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/fog_cloud_tileable.png);
    background-repeat: no-repeat, repeat;
}
.aoe-style-fog-cloud{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/fog_cloud_tileable.png) !important;
}
.aoe-style-hypnotic-pattern{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/hypnotic-pattern.png) !important;
}
.aoe-style-web{
    background-image: url(https://abovevtt-assets.s3.eu-central-1.amazonaws.com/aoe/tileable3pxsquareweb.png) !important;
}

[data-animation='fairy-fx'] .islight,
.aura-element[data-animation='fairy-fx'][id*='aura_'] {
    -webkit-mask-image: url('https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/fairys.png');
}

[data-animation='fairy-fx'] .islight:before,
.aura-element[data-animation='fairy-fx'][id*='aura_']:before {
    -webkit-mask-image: url('https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/fairys.png');
}

[data-animation='spore-fx'] .islight,
.aura-element[data-animation='spore-fx'][id*='aura_'] {
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/spore.png");
}

[data-animation='lightning-fx'] .islight,
.aura-element[data-animation='lightning-fx'][id*='aura_'] {
    --mask-1: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/lightningcircle.png");
}

[data-animation='magic-circle-fx'] .islight,
.aura-element[data-animation='magic-circle-fx'][id*='aura_'] {
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/magiccircle1.png");
}

[data-animation='magic-circle-2-fx'] .islight,
.aura-element[data-animation='magic-circle-2-fx'][id*='aura_'] {
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/magiccircle2.png");
}
[data-animation='hurricane-fx'] .islight,
.aura-element[data-animation='hurricane-fx'][id*='aura_'] {
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/hurricane_cloud.png");
}

[data-animation='hurricane-fx'] .islight:before,
.aura-element[data-animation='hurricane-fx'][id*='aura_']:before
{
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/lightning_2.png");
}
[data-animation='snow-fx'] .islight:before,
.aura-element[data-animation='snow-fx'][id*='aura_']:before,
[data-animation='snow-fx'] .islight:after,
.aura-element[data-animation='snow-fx'][id*='aura_']:after
{
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/snow.png");
}
[data-animation='bubble-fx'] .islight:before,
.aura-element[data-animation='bubble-fx'][id*='aura_']:before,
[data-animation='bubble-fx'] .islight:after,
.aura-element[data-animation='bubble-fx'][id*='aura_']:after
{
    -webkit-mask-image: url("https://abovevtt-assets.s3.eu-central-1.amazonaws.com/mask-images/bubble.png");
}


/* END AOE STYLES */


.token.isAoe .token-image,
.token.isAoe .token-image *,
.token.isAoe:before,
.token.isAoe div#note {
    visibility: visible;
}
.lineAoe{
    pointer-events:none;
}
.lineAoe *{
    pointer-events:auto;
}
.aoe-token-tileable {
    height: 100%;
    width: 100%;
    opacity: var(--opacity);
    background-repeat: repeat;
    background-size: 300px;
    filter: blur(0.5px);
    position: absolute;
    animation: mymove 5s infinite alternate ease-in-out ;
}
.reduceMovement .aoe-token-tileable {
    --opacity:0.5;
    animation: none !important;
}
#token_map_items .underDarkness .aoe-token-tileable{
    background-size: calc(300px / var(--scene-scale));
    filter: none;
}
#token_map_items .underDarkness .aoe-border-basic{
    border-width: calc(10px / var(--scene-scale));
}
@keyframes mymove {
    from{
        --opacity: 0.4
    }
    to {
        --opacity: 0.6
    }
  }
.above-vtt-container-roll-output{
    position: relative;
    top: 33%;
    left: 0px;
    width: 220px;
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #716f6f;
    font-size: 10px;
    font-weight: bold;
    line-height: 10px;
}
.abovevtt-roll-container{
    position:relative;
    width: 100%;
    cursor: pointer;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: row;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.abovevtt-roll-container [class*='-Divider']{
    margin: 0px 12px;
    flex: 0 0 auto;
}
.abovevtt-roll-container [class*='-Result']{
    flex: 1 1 auto;
    min-width: 0px;
    overflow: hidden;
    top: 0px;
    position: relative;
}
.abovevtt-roll-container [class*='Total-Other-Collapsed-Pending-Flex'] {
    min-width: 2.5rem;
    font-size: 2rem;
    font-weight: bold;
    flex: 0 0 auto;
    line-height: 1;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: row;
    -webkit-box-pack: center;
    justify-content: center;
}

.abovevtt-roll-container .above-vtt-roll-whisper {
    position: relative;
    left: 0px;
    width: 220px;
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #716f6f;
    font-size: 10px;
    font-weight: bold;
    line-height: 1;
}
div.token-image {
    width: 100%;
    height: 100%;
}

.ct-sidebar__portal>[class*='styles_mask']{
    display: none;
}

.ct-sidebar[class*='styles_sidebar'] {
    min-width: var(--sidebar-width, 340px) !important;
}

.ct-sidebar[class*='styles_sidebar'] [class*='styles_content'] {
    min-width: var(--sidebar-width, 340px) !important;
    max-width: var(--sidebar-width, 340px) !important;
}

.token:before{
    transform: rotate(calc(var(--token-rotation) + var(--token-heading)));
}

.markers-icon:before,
.context-menu-markers-icon:before {
    display: inline-block;
    width: 19px;
    height: 19px;
    top: 4px;
    position: relative;
    margin-right: 5px;
    content: "";
    background-size: 100%;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    flex-shrink: 1;
}
.markers-icon:before{
    top:0px;
}
input.condition-duration-input {
    position: relative !important;
    width: 22px !important;
    z-index: 2;
    text-align: right;
}

#tokenOptionsPopup [id*="flyout"] li {
    height: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}   

#conditions-flyout li span:not(.condition-lock) {
    flex-shrink: 1;
    flex-grow: 1;
    text-overflow: ellipsis;
    overflow-wrap: break-word;
    white-space: nowrap;
    overflow: hidden;
}
.condition-duration-input,
.condition-duration-icon {
    display: none;
}
.condition-duration-icon:before{
    content:'\efbf';
    font-size: 19px;
    font-family: "Material Symbols Outlined", sans-serif !important;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}
.active-condition .condition-duration-input,
.active-condition .condition-duration-icon {
    display: block;
}
.condition-duration-icon{
    position:absolute;
    left: 144px;
    top: 1px;
    z-index: 2;
    opacity: 0.4;
    pointer-events:none;
}
.condition-duration-icon.hiddenIcon{
    display:none;
}
.markers-icon .condition-duration-icon{
    left: 152px;
}
.markers-icon[class*='icon-#'] input.condition-duration-input{
    left: 9px;
}
[class*='icon-#']::before {
    display: none;
}
.icon-advantage:before,
.context-menu-icon-advantage:before {
    background-image: url(assets/conditons/advantage.png);
}
.icon-baned:before,
.context-menu-icon-baned:before {
    background-image: url(assets/conditons/baned.png);
}
.icon-bardic:before,
.context-menu-icon-bardic:before,
.icon-bardic-inspiration:before,
.context-menu-icon-bardic-inspiration:before {
    background-image: url(assets/conditons/bardic_inspiration.png);
}
.icon-blessed:before,
.context-menu-icon-blessed:before {
    background-image: url(assets/conditons/blessed.png);
}
.icon-bloodied:before,
.context-menu-icon-bloodied:before {
    background-image: url(assets/conditons/bloodied.png);
}
.icon-concentration-reminder:before,
.context-menu-icon-concentration-reminder:before {
    background-image: url(assets/conditons/concentration\(reminder\).png);
}
.icon-reaction-used:before,
.context-menu-icon-reaction-used:before {
    background-image: url(assets/conditons/reaction_used.png);
}
.icon-disadvantage:before,
.context-menu-icon-disadvantage:before {
    background-image: url(assets/conditons/disadvantage.png);
}
.icon-burning:before,
.context-menu-icon-burning:before {
    background-image: url(assets/conditons/burning.png);
}
.icon-flying:before,
.context-menu-icon-flying:before {
    background-image: url(assets/conditons/flying.png);
}
.icon-hasted:before,
.context-menu-icon-hasted:before {
    background-image: url(assets/conditons/hasted.png);
}
.icon-inspiration:before,
.context-menu-icon-inspiration:before {
    background-image: url(assets/conditons/inspiration.png);
}
.icon-rage:before,
.context-menu-icon-rage:before {
    background-image: url(assets/conditons/rage.png);
}

.aura-color button {
    width: 70%;
    height: 23px;
    border: 1px solid #3e3e3e;
    border-radius: 5px;
}

.context-menu-input.aura-color > label > input[type="text"] {
    display: none;
}

.context-menu-input.on-off-title > label > input[type="checkbox"] {
    float: right;
}

ul.context-menu-root {
    max-width: 180px;
}
ul.context-menu-list {
    column-count: 2;
    column-gap: 0;
}
ul.context-menu-list > li {
    column-span: all;
}
.context-menu-item.split-column-context-input {
    column-span: none;
    display: inline-block;
    zoom: 1;
    width: 100%;
    padding: 0.3em 0 !important;
}
.context-menu-item.split-column-context-input-text {
    width: 90%;
    margin: 0 5% !important;
}

.active-condition {
    border: 1px solid #cbc6c3;
    border-radius: 4px;
    background-color: rgba(203, 198, 195, 0.4) !important
}
.active-condition:hover {
    box-shadow: inset 0 0 4px 0 #dcd1c7;
    background-color: rgba(41, 128, 185, 0.9) !important;
}

.context-menu-helptext {
    max-width: 150px;
    color: grey;
    font-size: 0.9em;
}

.token-round{
    border-radius: 50%;
}

.soundpad-section audio{
    height:20px;
    width: 270px;
}

.soundpad-line-title{
    display: inline-block;
    width: 100%;
}

#hide_rightpanel {
    position: absolute;
    left: -32px;
    top: 2px;
}

#site .mfp-wrap {
    z-index: 100000;
}

.soundpad-section-title{
    font-weight: bold;
    background: #dddddd;
}

audio::-webkit-media-controls-current-time-display,
audio::-webkit-media-controls-time-remaining-display{
    display:none;
}

.loop-pressed{
    background:green;
}

.loop-img{
    height:20px;
}

.loop-button{
    position:relative;
    top: -2px;
}

.journal-note-entry{
    display: flex;
    align-items: center;
    box-sizing: border-box;
    margin: 0 8px 8px;
    background: #fff;
    border-radius: 3px;
}

.journal-note-entry:last-child {
    background: transparent;
}

.journal-entry-buttons{
    margin-left: auto;
    height: 20px;
}
.journal-note-entry-title{
    flex: 1;
    padding: 8px;
}

.journal-note-entry-title:hover {
    text-decoration: underline;
    cursor: pointer;
}

.visibility-container{
    border: 1px solid #dddddd;
    background: #e9e9e9;
    padding: 5px;
    min-width: 370px;
    margin-right: auto;
}
.visibility-container button {
    margin: 5px;
}


.visibility-container .visibility-toggle-container{
    display:none;
}
.share-player-visibility:hover .visibility-toggle-container,
.visibility-toggle-container:hover{
    display:block;
    height: fit-content;
    width: 136px;
    border-radius: 0px 0px 5px 5px;
    border: 1px solid #a8a8a8;
    position:absolute;
    top: 31px;
    left: 11px;
    background: #e9e9e9;
    z-index: 10;
}
.visibility_toggle_row{
    margin:5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.share-player-visibility:after{
    content:'';
    display: inline-block;
    position:relative;
    width: 5px;
    height: 5px;
    margin-left: 5px;
    top: 3px;
    border: 4px solid #000;
    border-color: #747272 #e9e9e9 #e9e9e9 #e9e9e9;
}
.share-player-visibility label {
    width: 70%;
    overflow-wrap: break-word;
}

.btn-del-chapter{
    right: 0;
    position: absolute;
    margin-top: 4px;
}

.note .mce-panel { 
    border:  none;
}
.note-text>p:first-of-type{
    margin-top: 0px !important;
}

.note .note-pin{
    background: url(https://drive.google.com/thumbnail?id=1excaNtaLfn_Hj5EHuH-h8iimpzC36i0M);
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    background-size: contain;
    z-index: 1000000;
    filter: drop-shadow(1px 2px 1px black);
}
.body-rpgcharacter-sheet .note .note-pin,
.avtt-spectator-sheet .note .note-pin{
    transform: translateY(43px);
}
.note .note-pin:after{
    position: absolute;
    content: attr(data-label);
    pointer-events: none;
    z-index: 1000000;
    color: #fff;
    text-shadow: 0px 0px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-size: 12px;
    white-space: nowrap;
    font-weight: bold;
    letter-spacing: 0.05em;
    transform: translate(-50%);
    left: 50%;
    bottom: -12px;
}
#help-overlay{
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 99999999; /*this seems super over the top but that's what's needed to appear over the combat button. I didn't want to change the z-index for that without checking first*/
}

#help-container{
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 99999999; /*this seems super over the top but that's what's needed to appear over the combat button. I didn't want to change the z-index for that without checking first*/
}

#help-menu-outside{
    backdrop-filter: saturate(50%) blur(20px);
    backdrop-filter: hue-rotate(90deg) saturate(30%);
    backdrop-filter: saturate(30%);
    backdrop-filter: brightness(30%);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#help-menu {
    max-width: 90vw;
    max-height: 90vh;
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
    position: absolute;
    top: 5%;
    left: 5%;
    /*transform: translate(-50%, -50%);*/
    padding: 5px;
    border-radius: 5px;
    z-index: 3;
    display: flex;
    overflow-y: auto;
}

#cpicker_overlay {
    position: fixed; /* Sit on top of the page content */
    display: block; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0); /* Black background with opacity */
    z-index: 100; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
  }

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
  }



  a {
    text-decoration: none;
  }

  .help-tabs {
      background-color: #f1f1f1;
      flex: 0 0 auto;
  }

  .help-tabs ul {
    margin: 0;
    padding: 0;
  }

  .help-tabs li {
    display: block;
    border-width: 1px 0px 1px 1px;
    margin: -1px;
    margin-bottom: 0px;
  }

  .help-tabs a {
    display: flex;
    padding: 10px 15px;
    color: rgb(0, 0, 0);
  }

  .help-tabs li:hover {
    background-color: #DDD;
  }

  .help-tabs li.active {
    background-color: #CCC;
    color: rgb(0, 0, 0);
  }

  .help-tabs li.active a {
    color: inherit;
  }

  .tabs-content {
    display: block;
    top: 0;
    border: 1px solid #34495E;
    padding: 10px;
    margin-top: -1px;
    overflow: auto;
  }

.tabs-content .googledoc iframe{
    width: 830px;
    height: 90vh;
    max-width: 90vw;
    margin-left: -85px;
    margin-top: -12px;
  }

  .tabs-content IMG {
    margin-right: 10px;
  }

  .tabs-content>div:not(:first-child) {
    display: none;
  }
.page-number {
    position: absolute;
    bottom: 40px;
    font-weight: bold;
}
.tabs-content dt {
    display: inline-block;
    text-align: center;
    margin: 0;
    padding: 1px 3px;
    border-radius: 2px;
    background-color: rgb(180, 173, 209);
    color: rgb(0, 0, 0);
    min-width: 8px;
    font-weight: bold;
    box-shadow: 1px 1px 3px 0px black;
}

.tabs-content dd {
    display: inline-block;
    margin: 0 0 0 5px;
}

.label-one-line {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.label-one-line:hover {
    overflow: visible;
    white-space: normal;
    width: auto;
}

.preserve-aspect-ratio {
    object-fit: contain;
    background-size: contain;
}

.sidebar-modal {
    position: fixed;
    z-index: 58000;
    align-items: center;
    justify-content: center;
    padding: 10px;
    overflow-y: auto;
    background-color: rgb(235, 241, 245);
    width: var(--sidebar-width, 340px);
    top: 30px;
    right: 0px;
    left: auto;
    height: calc(100vh - 30px);
}
.sidebar-modal-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.sidebar__pane-content .sidebar-panel-content,
.ct-sidebar__pane-content .sidebar-panel-content,
.ct-sidebar__inner [class*='styles_content'] .sidebar-panel-content{
    position: fixed;
    top: 30px;
    right: 0px;
    width: var(--sidebar-width, 340px);
    z-index: -1;
    height: calc(-45px + 100vh);
}
div.sidebar__pane-content > div.selected-tab,
div.ct-sidebar__pane-content > div.selected-tab,
.ct-sidebar__inner [class*='styles_content'] div.sidebar-panel-content.selected-tab
{
    z-index: 21;
}

.ct-sidebar--visible{
   height: calc(-15px + 100vh) !important;
}
.ct-sidebar__inner [class*='styles_controls']>span{
    visibility: hidden; 
    width: 0px;
    height: 0px; 
    position: absolute;
}

/*this may be a DDB bug - as the `Send to (default)` button scrolls off screen and messess with our layout as at 4/25/2024*/
.ct-sidebar__pane-content>div:first-of-type,
.ct-sidebar__inner [class*='styles_content']>div:first-of-type{
    height:100%;
}

.ct-sidebar__inner>[class*='styles_controls']{
    margin: 0px 0px 3px 0px;
}

.ct-sidebar__inner [class*='styles_content']{
    --border: none;
    padding-bottom: 0px;
}

.sidebar-panel-content{
    color: #000;
}

/* Make a few adjustments for when it's a modal because we nest it inside or .sidebar-modal and change the UI slightly  */
.sidebar-modal .sidebar-panel-content,
.sidebar-modal .sidebar-panel-content .sidebar-panel-header,
.sidebar-modal .sidebar-panel-content .sidebar-panel-body,
.sidebar-modal .sidebar-panel-content .sidebar-panel-footer {
    background-color: #fff;
}
.sidebar-modal .sidebar-panel-content .sidebar-panel-header,
.sidebar-modal .sidebar-panel-content .sidebar-panel-footer {
    padding: 0px;
}

.sidebar-panel-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    position: relative;
    overflow-y: auto;
    background-color: #fff;
}
.sidebar-panel-header {
    width: 100%;
}
.sidebar-panel-header-title {
    letter-spacing: .5px;
    display: flex;
    align-items: center;
    margin: 8px 0px 8px 8px;
    font-family: "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    justify-content: space-between;
}
.sidebar-panel-header-title:empty{
    margin: 0px;
}
.sidebar-panel-header-title .expand-collapse-wrapper {
    display: flex;
    flex-direction: row;
    margin-right: 6px;
}
.sidebar-panel-header-subtitle {
    font-size: 12px;
    font-weight: 700;
    color: #738694;
    line-height: 1.4;
    margin: 8px 0px 8px 8px;
}
.sidebar-panel-header-subtitle:empty{
    margin: 0px;
}
.reorder-explanation,
.sidebar-panel-header-explanation {
    font-size: 14px;
    color: #979AA4;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    margin: 8px 0px 8px 8px;
    padding: 0px;
}
.sidebar-panel-header-explanation:empty{
    margin: 0px;
}
.token-image-modal-footer-title {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    flex-grow: 1;
    color: #738694;
    line-height: 1.4;
    margin: 4px 6px 2px 2px;
}


span.add-input.slots {
    display: block;
}

div.token-image-modal-footer-title {
    font-size: 13px;
    /*width: 100%;*/
}
.image-size-wrapper .image-size-title {
    min-width: 60%;
}
h1.token-image-modal-footer-title,
h2.token-image-modal-footer-title,
h3.token-image-modal-footer-title,
h4.token-image-modal-footer-title,
h5.token-image-modal-footer-title {
    display: block;
}
h1.token-image-modal-footer-title:after,
h2.token-image-modal-footer-title:after,
h3.token-image-modal-footer-title:after,
h4.token-image-modal-footer-title:after,
h5.token-image-modal-footer-title:after {
    /* This was lifted from source book titles, and tweaked slightly */
    content: '';
    width: 100%;
    margin: 5px auto 20px;
    height: 1px;
    background-color: #979AA4;
    display: block;
}
.sidebar-panel-footer .token-config-aura-wrapper h3
 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-left: 4px;
}
.avtt-settings-section h4~div>h5.token-image-modal-footer-title:after {
    margin: 0px;
}

.sidebar-panel-footer input,
.token-image-modal-footer input {
    width: auto;
}
.sidebar-panel-footer-horizontal-wrapper,
.token-image-modal-footer-select-wrapper,
.token-image-modal-url-label-wrapper {
    display: flex;
    flex-direction: row;
    width: 100%;
    position:relative;
}
.sidebar-panel-footer-horizontal-wrapper .sidebar-panel-footer-button {
    margin: 0px 4px 0px 4px;
}
.avtt-settings-section{
    margin-bottom: 15px;
    padding:0px;
}
.avtt-settings-section h4:after{
    margin-bottom:5px;
}
.avtt-settings-section h4.token-image-modal-footer-title {
    font-size: 15px;
}

.avtt-settings-section h4~div>h5.token-image-modal-footer-title {
    margin-top: 20px;
    font-size: 12px;
    text-align: center;
    width: 100px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
.avtt-settings-section h4~div:first-of-type>h5.token-image-modal-footer-title {
    margin-top: 0px;
}
h3.no-bottom-margin-setting:after {
    margin-bottom:0px;
}

h3.no-bottom-margin-setting ~ .sidebar-panel-header-explanation{
    margin-bottom:20px;
}
.token-image-modal-footer-select-wrapper select {
    min-width: 34%;
    max-width: 34%;
}
.footer-input-wrapper {
    width: 100%;
    padding: 4px;
    border-top: 1px solid #d8e1e8;
}
.footer-input-wrapper .sidebar-panel-header-explanation {
    font-size: 12px;
    padding: 0;
}
.token-image-modal-url-label-wrapper {
    display: flex;
    flex-grow: 1;
}
.token-image-modal-url-label-add-wrapper {
    display: flex;
    flex-direction: row;
}
.token-image-modal-url-label-add-wrapper .token-image-modal-url-label-wrapper {
    flex-direction: column;
}
.token-image-modal-url-label-add-wrapper .token-image-modal-url-label-wrapper .token-image-modal-footer-title {
    width: 100%;
}
.token-image-modal-remove-all-button {
    appearance: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #e40712;
    border: none;
    color: #fff;
    align-self: stretch;
    font-size: 12px;
    padding: 4px;
    margin: 10px;
}
div#importer_area>div>div:first-of-type {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0px 5px;
}
.quick-menu-item-link.importer-back-button:before {
    content: '';
    border-width: 2px 0px 0px 2px;
    transform: rotate(-45deg);
    border-color: #000;
    border-style: solid;
    width: 8px;
    height: 8px;
    display: inline-block;
    position: relative;
    top: -2px;
}
.sidebar-panel-footer-button {
    appearance: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #1b9af0;
    border: none;
    color: #fff;
    align-self: stretch;
    margin: 4px 0px 4px 0px;
    padding: 10px;
    width: 100%;
    flex-grow: 0;
}
.avtt-small-settings-edit{
    height:fit-content;
    width:fit-content;
    margin: 2px 0px 0px 0px;
    padding:5px;
}
.token-image-modal-add-button {
    margin: 0px 4px 0px 4px;
    width: auto;
}
.example-token,
.custom-token-image-item {
    top: 0 !important;
    left: 0 !important;
    float: left !important;
    margin: 2px !important;
    position: relative !important;
    opacity: 1 !important;
}
.example-token.default-token-image:after{
    content: 'Default';
    color: #fff;
    text-shadow: 0px 0px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-size: 9px;
    font-weight:bold;
    display:flex;
    padding: 1px;
    position:absolute;
    bottom:20px;
    top:unset;
    z-index:10;
    justify-content: center;
    opacity:1;
    visibility:visible;
    left: unset;
    transform: unset;
    background:none;
    transition:none;
}
.example-token.removeTransition:after{
    transition:none;
}
div#token-change-image-modal img.example-token:first-of-type {
    box-shadow: 0px 0px 2px 2px #1b9af07a;
}
#token-change-image-modal .example-token{
    width:90px;
    height:90px;
}
.custom-token-image-item.ui-draggable-dragging {
    width: auto;
}
.custom-token-image-item [data-img],
.custom-token-image-item img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: inline-block;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

button.applyDamageButton {
    padding: 2px;
    margin: 0px 2px;
    border-radius: 5px;
    border-width: 1px;
    border-color: #ddd;
    display: flex;
    align-items: center;
    outline:none;
}
button.applyDamageButton svg {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
    padding: 2px 0px 0px 2px;
    margin:0px;
}

.block-send-to-game-log {
    position: absolute;
    display: flex;
    border-radius: 5px;
    border: none;
    outline: none !important;
    align-items: center;
    padding: 0px;
    margin: 0px;
    background: #eee;
    opacity: 0.5;
    right: 4px;
    top: 4px;
    cursor: pointer;
}

.block-send-to-game-log:hover {
    background-color: #888;
    opacity: 1;    
}

/*todo: not sure what this style is for?*/
td button.block-send-to-game-log {
    position: absolute;
    display: flex;
    float: unset;
    top:50%;
    right: 2px;
    transform: translate(0px, -50%);
}
/*size of send-to button*/
td button.block-send-to-game-log span{
    font-size:18px !important;
}
/*size of send-to button when in table*/
td > button.block-send-to-game-log > span {
    font-size:12px !important;
}

h3#error-message{
    max-height:100px;
    overflow:hidden;
    text-overflow: ellipsis;
}
div#initialPosition_row input{
    width: 60px;
    margin: 0px 4px;
}

div#initialPosition_row input::-webkit-outer-spin-button,
div#initialPosition_row input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: searchfield;
}

/*do our own css of mobile character sheets due to disabling ddb event that changes classes*/
.ct-character-sheet-mobile__header{
    position: sticky !important;
    top: -73px !important;
}
.ct-character-sheet-mobile{
    padding-top:0px !important;
}
.ct-combat-mobile{
    position: sticky !important;
    top: 0px !important;
}

div#initialPosition_row input[type=number] {
  -moz-appearance: textfield;
}
.note-text table.table-compendium>thead>tr {
    background-color: var(--theme-table-header-bg-color,#fdfdfd);
    color: var(--theme-table-header-fg-color,#222)
}

.note-text table.table-compendium>tbody>tr:nth-child(odd) {
    background-color: var(--theme-table-row-bg-dark, #faf8f7);
    color: var(--theme-table-row-fg-dark,#222)
}

.note-text table.table-compendium>tbody>tr:nth-child(2n),.body-page .p-article-a .p-article-content table.table-compendium tbody tr:nth-child(2n) {
    background-color: var(--theme-table-row-bg-light,#fdfdfd);
    color: var(--theme-table-row-fg-light,#222)
}

.note-text table.table-compendium>tbody>tr:hover {
    background-color: var(--theme-table-row-bg-hover,#e3f4eb);
    color: var(--theme-table-row-fg-hover,#222)
}
.note-text a{
    cursor:pointer;
}
.text--quote-box ~ .block-send-to-game-log{
    right:25px;
    top:-8px
}
.rules-text ~ .block-send-to-game-log{
    right:5px;
    top: 15px
}

.damageButtonsContainer {
    top:-15px;
    position:relative;
    display:flex;
}


.token.groupToken{
    display:none !important;
}
:is(#combat_area, #combat_area_carousel) tr[skipturn]{
    scale: 0.95;
}
:is(#combat_area, #combat_area_carousel) tr[skipturn]{
    display:none;
}
:is(#combat_area, #combat_area_carousel) tr[skipturn].showGroupTokens{
    display:table-row;
}
.custom-token-image-item [data-img]:hover {
    border: lightgrey solid 2px;
}

.token-image-sizing-dummy {
    /* this allows us to size the img using a 1:1 aspect ratio without having to use js to calculate the height after the felx width has been determined */
    margin-top: 100%;
}

.custom-token-list {
    display: flex;
    align-items: center;
    padding: 0px;
    flex-direction: column;
    background: rgb(235, 241, 245);
    height: 100%;
}
.sidebar-list-item-row.encounter,
.sidebar-list-item-row.folder {
    background-color: rgb(235, 241, 245);
}
.sidebar-list-item-row.encounter.collapsed,
.sidebar-list-item-row.folder.collapsed {
    background-color: #fff;
}
#scenes-panel .sidebar-list-item-row.scene-item .scene-bg {
    background-size: cover;
    background-repeat: no-repeat;
    filter: blur(1px);
    -webkit-filter: blur(1px);
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 30px;
}
#scenes-panel .sidebar-list-item-row.scene-item:not(.folder) .sidebar-list-item-row-img {
    background-color: gray;
    margin: -4px 0;
    border-radius: 0;
}
#scenes-panel .sidebar-list-item-row.scene-item:not(.folder) .sidebar-list-item-row-img img {
    border-radius: 0;
    max-height: none;
}
#scenes-panel .sidebar-list-item-row.scene-item .sidebar-list-item-row-item {
    position: inherit;
}
#scenes-panel .sidebar-list-item-row.scene-item .sidebar-list-item-row-img img {
    object-fit: cover;
    height: 38px;
}
#scenes-panel .sidebar-list-item-row.scene-item .sidebar-list-item-row-img .scene-list-item-is-video {
    font-size: 38px;
    text-align: center;
    color: lightgray;
}
.list-item-identifier.selected{
    border: 2px solid #66Fd;
}
.sidebar-flyout {
    position: fixed;
    z-index: 100000;
    box-shadow: 1px 1px 10px black, -1px -1px 10px black;
    border-radius: 5px;
    overflow: hidden;
}
.sidebar-flyout .flyout-text-input {
    background: none rgb(255, 255, 255);
    border: 1px solid rgb(221, 221, 221);
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
    color: rgb(0, 0, 0);
    padding: 4px;
    transition: border 0.2s linear, box-shadow 0.2s linear;
    font-family: Roboto, Helvetica, sans-serif;
    font-size: 100%;
}
.list-item-image-flyout {
    width: 400px;
    height: 400px;
    object-fit: cover;
    display: block;
}
.sidebar-token-options-flyout-container {
    width: 400px;
    max-height: 90vH;
    padding: 10px;
    overflow: auto;
    background-color: rgb(235, 241, 245);
}
#scenes-panel .sidebar-list-item-row.scene-item .scene-item-footer {
    display: flex;
    flex-direction: row;
    margin: -4px -4px -4px -4px;
}
#scenes-panel .sidebar-list-item-row.scene-item {
    cursor: default;
}
#scenes-panel .selected-scene {
    background-color: #c53131;
    background-position: center;
}
#scenes-panel .selected-scene svg path {
    fill: #fff;
}
.scene-item-footer > button {
    flex-grow: 1;
    margin: 0;
    padding: 0;
    border-radius: 0;
    border-width: 0;
    overflow: hidden;
}
#folder-configuration-modal .token-image-modal-footer-select-wrapper {
    margin-top: 5px;
}
.encounter .folder-item-list,
.folder .folder-item-list {
    padding-left: 8px;
    padding-top: 0.5em;
    cursor: default;
}
.encounter .folder-item-list:empty:before,
.folder .folder-item-list:empty:before {
    content: "This folder is empty";
    color: #738694;
}
.encounter.collapsed .folder-item-list,
.folder.collapsed .folder-item-list {
    display: none;
}
.encounter > .sidebar-list-item-row-item .token-row-button,
.folder > .sidebar-list-item-row-item .token-row-button {
    background-color: rgb(235, 241, 245);
}
.encounter.collapsed > .sidebar-list-item-row-item .token-row-button,
.folder.collapsed > .sidebar-list-item-row-item .token-row-button {
    background-color: #fff;
}
.sidebar-list-item-row {
    position: relative;
    padding: 4px 0px;
    width: 100%;
    margin: 2px 0px;
    border: 1px solid #d8e1e8;
    border-color: #3d6e9352;
    border-radius: 3px;
    background-color: #fff;
    cursor: pointer;
}
.sidebar-list-item-row:not(.folder) {
    overflow: hidden;
}
.sidebar-list-item-row-item {
    display: flex;
    width: 100%;
    padding-right: 4px;
    padding-left: 4px;
}
.sidebar-list-item-row-img {
    display: flex;
    flex-basis: 38px;
    width: 38px;
    max-width: 38px;
    height: 100%;
    max-height: 38px;
    border-radius: 3px;
    object-fit: cover;
}
.sidebar-list-item-row-img .aoe-shape-line{
    transform: scaleX(0.5);
}
.custom-token-image-item .aoe-shape-line{
    width: 50%;
    left: 25%
}
.custom-token-image-item .aoe-token-tileable,
.sidebar-list-item-row-img [data-img]{
    background-size: 100px;
    animation: none;
    opacity: 100%;
}
.sidebar-list-item-row-img [data-img],
.sidebar-list-item-row-img img {
    object-fit: contain;
    width: 38px;
    max-width: 38px;
    height: 100%;
    max-height: 38px;
}
.sidebar-list-item-row-details {
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    flex-grow: 1;
    color: #10161a;
    width:50%;
    margin-left: 8px;
    margin-right: 8px;
    line-height: 1.4;
    font-family: Roboto, "Open Sans", Helvetica, sans-serif;
    text-align: left;
    white-space: nowrap;
}
.sidebar-list-item-row-details div {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.sidebar-list-item-row-details-title {
    font-size: 13px;
    font-weight: 700;
}
.sidebar-list-item-row-details-subtitle {
    color: #738694;
    font-size: 10px;
}
.sidebar-list-item-row-item div.sidebar-list-item-row-details-subtitle .legacy-monster {
    color: rgb(18, 24, 28);
    background-color: rgba(18, 24, 28, 0.12);
    border-radius: 4px;
    flex-grow: 0;
}
.sidebar-list-item-row-item div.sidebar-list-item-row-details-subtitle .legacy-monster span {
    font-family: Roboto;
    font-weight: 500;
    line-height: 20px;
    font-size: 12px;
    letter-spacing: 0px;
    padding: 0px 6px;
}

#door_types{
    padding: 2px;
    width: 105px;
}

.token-row-button{
    position: relative;
    display: block;
    width: 30px;
    border-radius: 3px;
    object-fit: cover;
    background: #fff;
    border: 1px solid #d8e1e8;
    cursor: pointer;
    margin: 0 2px;
    min-width: 30px;
}
#playersFolder .folder-item-list .token-row-button,
#playersFolder .folder-item-list .token-row-gear {
    position: relative;
    display: block;
    width: 24px;
    border-radius: 3px;
    object-fit: cover;
    background: #fff;
    border: 1px solid #d8e1e8;
    cursor: pointer;
    margin: 0 2px;
    min-width: 24px;
    height: 21px;
}

.note-text ul{
    list-style-type: disc;
}
.note-text li>ul{
    list-style-type: circle;
}
.note-text li>ul ul{
    list-style-type: square;
}
.note-text ol{
    list-style-type: decimal;
}
.note-text>ol,
.note-text>ul{
    display: block;
    margin-block-start: 1em;
}
.note-text ol,
.note-text ul{
    padding-inline-start: 40px;
}


.note-text iframe.journal-site-embed,
.note-text form:has(>.mce-tinymce) iframe {
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    top: 0px;
}
.note-text iframe.journal-site-embed,
.note-text form:has(>.mce-tinymce) iframe{
    top: 0px;
    height: 100%;
    border: none;
}

.note-text>p:has(.journal-site-embed),
.note-text form:has(>.mce-tinymce iframe) {
    height: 100%;
    display: block;
    position: absolute;
    width: 100%;
}

.note .note-text .more-info .detail-content{
    width: 100%;
}

.body-rpgcharacter-sheet .note-text,
.avtt-spectator-sheet .note-text{
    top: 0px;
}

.body-rpgcharacter-sheet .note-text>p:first-of-type,
.avtt-spectator-sheet .note-text>p:first-of-type{
margin:0px;
}
.sidebar-list-item-row.player-row {
    height: 120px;
    transition: height 250ms linear;
}
.sidebar-list-item-row.player-row .player-expansion-button {
    height: 16px;
    margin: 0px 0px -8px 0px;
    bottom: 8px;
    position: absolute;
    left: 0px;
    right: 0px;
    color: #838383;
    line-height: 1;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    background-color: #f2f2f2;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle {
    flex-direction: row;
    justify-content: start;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute {
    font-size: 12px;
    min-width: 50px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute.legacy-attribute{
    flex-grow: 1;
    display:flex;
    justify-content: flex-end;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute img {
    width: 24px;
    height: 24px;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute .material-icons {
    font-size: 18px;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute .plain-text {
    font-size: 18px;
    margin-top: -2px;
    font-family: 'Material Icons', serif;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
}
.sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute.inspiration {
    position: absolute;
    top: 2px;
    right: 82px;
}
.sidebar-list-item-row.player-row .player-expansion-button .material-icons {
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
}
.sidebar-list-item-row.player-row.expanded {
    height: fit-content;
    padding-bottom:20px;
    transition: height 250ms linear;
}
.sidebar-list-item-row.player-row .player-card-footer {
    max-height: 76px;
    height: 76px;
    margin-top: 4px;
}

.sidebar-list-item-row.player-row .ability_value {
    margin: 8px 0;
}
.sidebar-list-item-row.player-row .token-row-add > .material-icons {
    display: none;
}
.sidebar-list-item-row.player-row.on-scene .token-row-add > .material-icons {
    display: inline-block;
    color: #1b9af0;
}
.sidebar-list-item-row.player-row.on-scene .token-row-add > svg {
    display: none;
}
.sidebar-list-item-row.player-row .token-row-gear {
    border-bottom-right-radius: 0;
}
.sidebar-list-item-row.player-row.button-loading .sidebar-list-item-row-details-subtitle {
    content: "loading character sheet yo!";
}
.sidebar-list-item-row.player-row.expanded .token-row-gear {
    border-bottom: 1px solid #d8e1e8;
}
.token-row-button .material-icons {
    padding: 2px 0px 0px 0px;
    margin-left: -4px;
}
.token-row-button svg {
    width: 100%;
    height: 100%;
    fill: #1b9af0;
}
.token-row-gear {
    display: block;
    width: 30px;
    padding: 7px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background-color: #f2f6f8;
    border-left: 1px solid #d8e1e8;
    margin: -4px -4px -4px 2px;
    cursor: pointer;
    min-width: 30px;
}
.token-row-gear img {
    width: 100%;
    height: 100%;
    fill: #738694;
}
button.token-row-button.token-row-edit-encounter{
    padding:0px;
}
.sidebar-list-item-row.encounter .player-row > .sidebar-list-item-row-item,
.sidebar-list-item-row.folder .player-row > .sidebar-list-item-row-item {
    height: 42px; /* players are taller than everything else */
}
.sidebar-list-item-row.encounter > .sidebar-list-item-row-item,
.sidebar-list-item-row.folder > .sidebar-list-item-row-item {
    height: 30px; /* folders are shorter than everything else */
}
.sidebar-list-item-row.encounter > .folder-item-list > .encounter-monster-group.grouped,
.sidebar-list-item-row.folder > .folder-item-list > .encounter-monster-group.grouped {
    border: 2px dashed #1b9af0;
    border-radius: 3px;
    padding: 0px 2px;
    margin: 2px 0px;
}

.sidebar-panel-content {
    align-items: center;
    justify-content: center;
    overflow-y: auto;
    background-color: rgb(235, 241, 245);
    height: 100%;
}
.sidebar__pane-content>div.sidebar-panel-content {
    display: none;
    pointer-events: none;
}

.sidebar__pane-content>div.sidebar-panel-content.selected-tab {
    display: flex;
    pointer-events: auto;
}
.sidebar-panel-content .sidebar-panel-body {
    height: 100%;
    padding: 8px;
}
#monsters-panel .sidebar-panel-body {
    padding: 0px;
}
#players-panel .sidebar-panel-body {
    padding: 0px;
}
#playersFolder .sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute{
    flex-grow: 0;
    margin-right: 0px;
}
.sidebar-panel-content .sidebar-panel-body {
    background-color: rgb(235, 241, 245);
    position: relative; 
    width:100%; 
    overflow-y: auto;
    flex: auto;
}
#token-configuration-modal .sidebar-panel-body{
    min-height: 265px;
    max-height: 265px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    overflow-x: hidden;
}
#token-configuration-modal{
    height: unset;
}
#tokens-panel{
    overflow-x: hidden;
}
.tokens-panel-back-button {
    background-image: url(https://media-waterdeep.cursecdn.com/file-attachments/0/737/chevron-left-green.svg);
    background-repeat: no-repeat;
    background-position: left;
    padding: 4px;
    cursor: pointer;
    margin: 0px 12px;
}
.tokens-panel-back-button div {
    padding-left: 20px;
    color: #878787;
    text-transform: uppercase;
    font-family: "Roboto Condensed", Roboto, Helvetica, sans-serif;
    font-weight: bold;
}
.sidebar-panel-content .sidebar-panel-header {
    background-color: rgb(235, 241, 245);
    padding: 0px;
}
.sidebar-panel-content .sidebar-panel-footer {
    display: flex;
    flex-direction: column;
    padding: 0px;
    background-color: rgb(235, 241, 245);
    width: 100%;
    align-items: center;
}
#playersFolder .player-card-info {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: center;
}
#playersFolder span.ct-health-summary__deathsaves-label {
    font-size: 9px;
    font-weight: bold;
    text-transform: none;
    color: #666;
    margin: 0px;
    text-align: center;
}
#playersFolder .players-popout-button{
    position: absolute;
    top: 0px;
    left: 100px;
    margin-right: 5px;
    margin-top: 5px; 
}
#playersFolder .players-popout-button.subfolder-popout{
    left:unset;
    right:30px;
}
#playersFolder .hp-attribute.death-saves.ct-health-summary__data.ct-health-summary__deathsaves {
    float: right;
    margin: 2px 6px 2px 2px;
    border: 1px solid #d8e1e8;
    border-radius: 2px;
    display: flex;
    width: 80px;
    flex-direction: column-reverse;
    justify-content: flex-end;
    height: fit-content;
    padding: 2px 0px 0px 0px;
}
#playersFolder .ct-health-summary__deathsaves-group, 
#playersFolder .ct-health-summary__exhaustion-group{
    flex-direction: column;
}

#playersFolder .ct-health-summary__deathsaves-mark, 
#playersFolder .ct-health-summary__exhaustion-mark {
    width: 11px;
    height: 11px;
    border: none;
}

#playersFolder .player-card-info .subtitle-attibute,
#playersFolder .subtitle-attibute.hp-attribute  {
    font-weight: bold;
    display: flex;
    font-size: 18px;
    flex-direction: column-reverse;
    width: 52px;
    text-align: center;
}

#playersFolder span.subtitle-title {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: flex-end;
    line-height: 10px;
    margin-bottom: 3px;
    padding: 2px;
    font-size: 9px;
    color: #666;
}
#playersFolder .subtitle-attibute.hp-attribute {
    border: 1px solid #d8e1e8;
    border-radius: 2px;
    display: flex;
    width: 80px;
    flex-direction: column-reverse;
    float: right;
    margin: 2px 6px 2px 2px;
}

#playersFolder .sidebar-list-item-row .sidebar-list-item-row-details-subtitle .subtitle-attibute{
        align-items: center;
}
#playersFolder span.hp-value {
    color: #1b9af0;
}
#playersFolder .folder-item-list .token-row-button svg, 
#playersFolder .folder-item-list .token-row-gear img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transform: scale(0.8);
}
#playersFolder .folder-item-list>.folder>.sidebar-list-item-row-item>.token-row-gear{
    display: block;
    width: 30px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background-color: rgb(242, 246, 248);
    cursor: pointer;
    min-width: 30px;
    padding: 7px;
    border-left: 1px solid rgb(216, 225, 232);
    margin: -4px -4px -4px 2px;
    height:auto;
    border-radius: 0px;
    padding: 7px;
}
#playersFolder .folder-item-list>.folder>.sidebar-list-item-row-item>.token-row-gear img{
    transform:initial;
    position:initial
}
#playersFolder .token-row-button .material-icons{
    font-size: 18px;
    padding: 0px;
}
#playersFolder>.sidebar-list-item-row-item:first-of-type>.token-row-button .material-icons {
    font-size:25px;
}
#playersFolder .ddbc-box-background svg path{
    fill: var(--player-border-color, #F00);
}

.fly-svg path,
.fly-svg rect{
    fill: #738694;
}
.fly-svg{
    width: 10px;
}
.climb-svg{
    width: 16px;
}
.chat-link {
  word-wrap: break-word;
  width: 100%;
  text-decoration: underline;
}
.ddbc-number-bar {
    display: flex;
    position: relative;
    height: 10px;
    flex-direction: row;
}

span.exhaustion-pip {
    height: 4px;
    width: 10px;
    display: inline;
    position: relative;
    margin: 1px;
    border: 1px solid #666;
}
span.exhaustion-pip.filled {
    background: #202020;
}

span.exhaustion-pip.first{
    border-bottom-left-radius: 5px;
    border-top-left-radius:5px;
}
span.exhaustion-pip.last{
    border-bottom-right-radius: 5px;
    border-top-right-radius:5px;
}

.subtitle-attibute.exhaustion-attribute {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    top: 26px;
    right: 10px;
}

#playersFolder .exhaustion-attribute span.subtitle-title {
    margin-bottom: 0px;
    font-weight: bold;
    font-size: 9px;
}

.example-tokens-wrapper {
    width: 100%;
    height: 100px;
    display: flex;
    margin: 10px 0px;
    justify-content: space-between;
}
.example-token{
    --window-zoom: 1;
}
.example-token.selected:before {
    content: 'Customizing';
    font-weight:bold;
    text-shadow:0px 0px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    display:flex;
    font-size:10px;
    position:absolute;
    color: #FFF;
    width:100%;
    height:100%;
    z-index:1;
    flex-direction: row-reverse;
    justify-content: center;
}
/* all the rc-switch styles were lifted from the content sharing screen /campaigns/<campaign_id>/content-management and then tweaked slightly */
.rc-switch {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    width: 44px;
    height: 22px;
    line-height: 20px;
    padding: 0;
    vertical-align: middle;
    border-radius: 20px 20px;
    border: 1px solid #ccc;
    background-color: #ccc;
    cursor: pointer;
    transition: background-color 0.3s cubic-bezier(0.35, 0, 0.25, 1), border 0.3s cubic-bezier(0.35, 0, 0.25, 1);
}
.rc-switch-checked {
    border: 1px solid #1b9af0;
    background-color: #1b9af0;
    background-image: none !important;
}
.rc-switch-checked:after {
    left: 22px;
}
.rc-switch-unknown {
    border: 1px solid #1b9af0;
}
.rc-switch-unknown:after {
    left: 11px;
}
.rc-switch:after {
    position: absolute;
    width: 18px;
    height: 18px;
    left: 2px;
    top: 1px;
    border-radius: 50% 50%;
    background-color: #fff;
    background-image: none !important;
    content: " ";
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.26);
    transform: scale(1);
    transition: left 0.3s cubic-bezier(0.35, 0, 0.25, 1);
    -webkit-animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
    animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-name: rcSwitchOff;
    animation-name: rcSwitchOff;
}
.rc-switch-inner {
    color: #fff;
    font-size: 12px;
    position: absolute;
    left: 24px;
    top: 0;
}
.rc-switch-checked .rc-switch-inner {
    left: 6px;
}
.rc-switch-unknown .rc-switch-inner {
    left: 9px;
}
.rc-switch-checked:after {
    left: 22px;
}
.rc-switch-unknown:after {
    left: 11px;
}
.rc-switch:hover:after {
    transform: scale(1.1);
    -webkit-animation-name: rcSwitchOn;
    animation-name: rcSwitchOn;
    background-image: none !important;
}
.rc-switch:focus{
    outline: 2px solid #000;
}

#grid_toggle:not(.rc-switch-checked) ~ *{
    display:none !important;
}
.sidebar-hover-text-flyout {
    display: block;
    max-width: 400px;
    padding: 0px 10px;
    background-color: rgba(28,29,30,0.8);
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 14px;
    text-transform: none;
}
.sidebar-hovertext:before {
    content: attr(data-hover);
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 14px;
    text-transform: none;
    visibility: hidden;
    opacity: 0;
    width: max-content;
    background-color: rgba(28,29,30,0.8);
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 5px 5px;
    transition: opacity 1s ease-in-out;
    position: absolute;
    z-index: 1;
    right: 5%;
    margin-top: 30px;
    width: 90%;
}

#edit_scene_form .sidebar-hovertext:before,
#edit_scene_form .sidebar-hovertext:hover:before{
    max-width: 300px;
    width: max-content;
}
.ct-sidebar{
    inset: 0px 0px 0px auto !important;
    right: 0px !important;
 }

.chat-text-wrapper.sidebar-hover-text:before  {
    transition: opacity 0ms;
    content: attr(data-hover);
    display:block;
    position:absolute;
    white-space: pre;
    bottom: 100px;
    text-align: left;
    background:rgb(18, 18, 18);
    padding:5px;
    border:1px solid #ababab;
    border-radius:5px;
    pointer-events:none;
    opacity: 0;
    color: #fff;
}
.body-rpgcampaign:not(.encounter-builder-page) .chat-text-wrapper.sidebar-hover-text:before  {
    bottom:35px;
}
.chat-text-wrapper.sidebar-hover-text:hover:before {
    transition: opacity 500ms linear 500ms;
    opacity: 1;
}
.sidebar-hovertext:hover:before {
    opacity: 1;
    visibility: visible;
}
.sidebar-panel-content .sidebar-panel-footer .footer-input-wrapper:empty {
    padding: 0px;
    border-top: 0px solid #d8e1e8;
}
.sidebar-panel-loading-indicator {
    padding: 40px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: rgb(235, 241, 245);
    z-index: 10;
    /* easy debugging */
    /* opacity: 0.5; */
}
.loading-status-indicator__subtext {
    font-size: 14px;
    color: #738694;
    margin-bottom: 8px;
    text-align: center;
}
.beholder-dm-screen__beholder {
    animation-duration: 6s;
    animation-timing-function: ease-in-out;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: beholder-float;
}
@keyframes beholder-float {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, -20px); }
    100%   { transform: translate(0, -0px); }   
}

div.sidebar__pane-content div.tooltip::after {
    background: none !important;
}
.dm-eyes-only{
    border: 1px solid #000;
    border-radius: 5px;
    background: #f5f5f5;
    padding: 0px 5px;
    margin: 9px 10px;
}
.dm-eyes-only:before {
    display:block;
    position:relative;
    content:'DM Eyes Only';
    top: -10px;
    right: 2px;
    float:right;
    border:1px #000 solid;
    border-radius:5px;
    background: #f5f5f5;
    font-weight: bold;
    font-size:10px;
    padding:0px 4px;
}
.body-rpgcharacter-sheet .dm-eyes-only,
.avtt-spectator-sheet .dm-eyes-only{
    display:none;
}
.elev svg{
    left: -7px;
    position: absolute;
}

.elev{
    pointer-events: none;
    z-index: 1;
}
.age svg{
    left: -7px;
    position: absolute;
}

.age{
    pointer-events: none;
    z-index: 1;
}
.token img:not(.note-condition):not(.condition-img), .token [data-img]:not(.aoe-shape-line), .token .token-image{
    pointer-events:none !important;
}
.div-token-image{
    background-repeat: no-repeat !important;
    background-size: var(--image-zoom, cover) !important;
}
.div-token-image.preserve-aspect-ratio{
    background-size: var(--image-zoom, contain) !important;
}
.set-conditions-button .tooltip-hover,
.remove-conditions-button .tooltip-hover{
    pointer-events:none;
}
div button.add-monster-token-to-vtt {
    border-radius: 5px;
    padding: 2px 6px;
    border: 1px solid var(--theme-color);
    background: var(--theme-background);
}
button.avtt-roll-button,
.avtt-ability-roll-button{
    /* lifted from DDB encounter stat blocks  */
    color: #b43c35;
    border: 1px solid #b43c35;
    border-radius: 4px;
    background-color: #fff;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    font-family: Roboto Condensed,Open Sans,Helvetica,sans-serif;
    line-height: 18px;
    letter-spacing: 1px;
    padding: 1px 4px 0;
}

.tooltip .above-aoe.integrated-dice__container,
.avtt-aoe-button {
    display: inline-flex;
    padding: 0px;
    color: #b43c35;
    border: 1px solid #b43c35;
    border-radius: 4px;
    background-color: #fff;
    white-space: nowrap;
    font-size: 14px;
    padding: 1px 2px 1px 3px;
    font-weight:bold;
    cursor: pointer;
}

.tooltip .avtt-roll-button,
.avtt-ability-roll-button{
    cursor: pointer;
}

.tooltip .aoe-size{
    display:flex;
    align-items: center;
}
button.avtt-roll-button:has(button.avtt-roll-button) {
    border:0 !important;
    margin: 0px !important;
    padding: 0px !important;
}

.ddbc-snippet p.above-vtt-visited button.avtt-roll-button{
    font-size:unset;
    font-weight:unset;
}

.ct-sidebar__portal{
    overflow: unset !important;
    z-index: 57000 !important;
    width:100%; /* allows positioning of menus to be correct, remove pointer-events to stop it from taking up all clicks*/
    pointer-events: none;
}
.ct-sidebar__portal .ct-sidebar__inner,
.ct-sidebar__portal>[role='presentation']:not([aria-hidden=true]) .MuiBackdrop-invisible{
    pointer-events: auto; /*override pointer events of portal to allow clicking in the actual sidebar*/
}
.ct-sidebar__portal>[role='presentation'] .MuiPopover-paper{
    width: fit-content;
    padding:0px;
}

.ct-sidebar__portal>[role='presentation'] .MuiPopover-paper ul{
    padding:10px;
}
body>[role='presentation'] .MuiPopover-paper{
    width: fit-content;
    padding:0px;
}

button.avtt-roll-formula-button {
    font-size: 14px;
    cursor: default;
    color: #394B59;
    padding: 9px;
}
.abovevtt-slash-command-journal button {
    color: #b43c35;
    border: 1px solid #b43c35;
    border-radius: 4px;
    background-color: #fff;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    font-family: Roboto Condensed,Open Sans,Helvetica,sans-serif;
    line-height: 18px;
    letter-spacing: 1px;
    padding: 1px 4px 0;
}
.MuiPaper-root:not(.MuiAlert-root) {
    padding: 0px 16px;
    width: 100px;
    pointer-events: auto;
}

.MuiListItemText-root {
    flex: 1 1 auto;
    min-width: 0;
    margin-top: 4px;
    margin-bottom: 4px;
}
.MuiButtonBase-root {
    width: 100%;
}
.MuiButtonBase-root.PrivateSwitchBase-root {
    width: unset;
}
.MuiModal-root,
#sounds-panel .volume-control {
    width: 50%;
    float: right;
}

#sounds-panel .channel-progress-bar-total {
    width: 100%;
    position: relative;
    height: 1px;
    bottom: 4px;
    left: 0px;
    background: lightgray;
}

#sounds-panel .channel-progress-bar-progress {
    width: 0%;
    position: relative;
    height: 1px;
    bottom: 0px;
    left: 0px;
    background: #0075FF;
}

#sounds-panel .sidebar-panel-header {
    padding: 0px 0px 0px 4px;
    border-bottom: 1px solid #2b2b2b;
}

#sounds-panel .sidebar-panel-header .audio-row {
 padding: 0px 8px 0px 0px
}
#sounds-panel .audio-row  {
    height: 25px;
}

#track-list .audio-row.hidden-track{
    display:none;
}

#track-list li:hover {
    background-color:lightskyblue;
}

#track-list button {
    float: right;
    height: 100%;
}

.sidebar-panel-footer button.custom-stat-buttons{
   appearance: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #1b9af0;
    border: none;
    color: #fff;
    align-self: stretch;
    margin: 4px 0px 4px 0px;
    padding: 10px;
    width: 100%;
    flex-grow: 0;
    font-size: 16px;
    color: #fff;
}



#VTT{
    z-index:2;
    transform: scale(var(--window-zoom));
}

.ability-block {
    font-size: 14px;
    display: flex;
    flex-wrap: wrap;
    margin: 10px 0;
    color: #4f1300;
}
.ability-block__stat {
    width: 30%;
    padding: 5px 0;
    text-align: center;
}

.ability-block__heading {
    font-weight: bold;
}

.ability-block__data {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.ability-block__modifier {
    margin-left: 2px;
}
.mon-stat-block__meta {
    font-style: italic;
    margin-bottom: 15px;
}
.mon-stat-block__name {
    color: #822000;
    font-family: MrsEavesSmallCaps,Roboto,Open Sans,Helvetica,sans-serif;
    font-size: 34px;
    font-weight: 700;
}
.mon-stat-block__attribute, .mon-stat-block__feature {
    color: #822000;
    line-height: 1.2;
    margin: 5px 0;
}
.mon-stat-block__name .mon-stat-block__name-link, 
.mon-stat-block__name .mon-stat-block__name-link:active, 
.mon-stat-block__name .mon-stat-block__name-link:hover, 
.mon-stat-block__name .mon-stat-block__name-link:visited {
    color: #822000;
}
.mon-stat-block__attribute-label, 
.mon-stat-block__feature-label{
        font-weight: 700;
}
.mon-stat-block{
    padding: 15px 10px;
}
.more-info footer{
    padding: 0px;
}
.mon-stat-block{
    padding: 15px 10px;
  
}
.ddbc-creature-block__name {
    font-size: 30px;
}

.ddbc-creature-block {
    background: url(https://www.dndbeyond.com/Content/Skins/Waterdeep/images/mon-summary/stat-block-top-texture.png),url(https://www.dndbeyond.com/Content/Skins/Waterdeep/images/mon-summary/paper-texture.png);
    background-size: 100% auto;
    background-position: top;
    background-repeat: no-repeat,repeat;
    position: relative;
    box-shadow: 0 0 5px #979aa4;
    border: 1px solid #d4d0ce;
    padding: 15px 10px;
    font-family: Scala Sans Offc,Roboto,Helvetica,sans-serif;
    font-size: 15px
}

.ddbc-creature-block:after,.ddbc-creature-block:before {
    content: "";
    display: block;
    background: url(https://www.dndbeyond.com/Content/Skins/Waterdeep/images/mon-summary/stat-bar-book.png) 50%;
    background-size: 100% 100%;
    height: 6px;
    position: absolute;
    left: -3px;
    right: -3px
}

.ddbc-creature-block:before {
    top: -3px
}

.ddbc-creature-block:after {
    bottom: -3px
}
.monster-details .more-info.details-more-info:after {
    display:none
}
.monster-details .more-info-content{
    padding: 0px !important;
}
.monster-details,
.detail-content .image{
    margin-bottom:0px;
}
.mon-stat-block__description-block h3, .mon-stat-block__description-block-heading {
    border-bottom: 1px solid #822000;
    color: #822000;
    font-family: Scala Sans Offc,Roboto,Open Sans,Helvetica,sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 15px;
    margin-top: 20px;
}
.top_menu.visible,
.ddbc-tab-options--layout-pill{
    z-index: 125000;
}

/*combat tracker face lift*/
/* Also used in resize can remove if that goes in*/
#combat_footer,
#combat_tracker_inside{
    border-style: solid;
    border-color: #ddd; 
}
#combat_footer{
    border-width: 0px 1px 1px 1px;
    border-radius: 0px 0px 5px 5px; 
    left: -1px;
    right: -1px;
    position: absolute;
}

#combat_footer button{
    flex-grow: 1;   
}
#combat_footer{
    display: flex;   
}
#combat_tracker_inside {
    border-width: 1px 1px 0px 1px;
    border-radius: 5px 5px 0 0;
}
.body-rpgcharacter-sheet #combat_tracker_inside,
.avtt-spectator-sheet #combat_tracker_inside{
    width: 200px;   
}
#combat_tracker_inside #combat_footer button:last-of-type{
    border-bottom-right-radius: 5px;   
}
#combat_tracker_inside #combat_footer button:first-of-type{
    border-bottom-left-radius: 5px; 
}

.body-rpgcharacter-sheet #combat_tracker_inside,
.avtt-spectator-sheet #combat_tracker_inside{
    border-radius: 5px;
}
/* end also used in resize can remove if that goes in*/
/*Changes for combat tracker UI*/
#combat_footer{
    padding: 13px 4px 4px 4px;
}
:is(#combat_area, #combat_area_carousel) tr td:first-of-type,
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(2)
{
    width: 13%;
}
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(4) {
    width: 5px;
}
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(3),
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(5) {
    width: 13%;
}
.body-rpgcharacter-sheet :is(#combat_area, #combat_area_carousel) tr td:nth-of-type(3),
.body-rpgcharacter-sheet :is(#combat_area, #combat_area_carousel) tr td:nth-of-type(5), 
.avtt-spectator-sheet :is(#combat_area, #combat_area_carousel) tr td:nth-of-type(3),
.avtt-spectator-sheet :is(#combat_area, #combat_area_carousel) tr td:nth-of-type(5) {
    width: 18%;
}

:is(#combat_area, #combat_area_carousel) tr td:first-of-type,
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(2),
:is(#combat_area, #combat_area_carousel) tr td:nth-of-type(3)
:is(#combat_area, #combat_area_carousel) td:last-of-type {
    padding: 0px 5px 0px 0px;
}
:is(#combat_area, #combat_area_carousel) tr{
    position: relative;
}
.resize_drag_window{
    pointer-events:none;
    background:none;
}
.resize_drag_window > *{
    pointer-events:all;
}


#text_controller_title_bar,
.text-input-title-bar,
.resize_drag_window .title_bar,
#combat_tracker_title_bar {
    width: 100%;
    background: #242527;
    height: 25px;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    color: #fff;
    border-style: solid;
    border-width: 1px 1px 0px 1px;
    border-color:  gray;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    line-height: 26px;
    text-shadow: 0px 0px  #000,
        -1px -1px 0  #000,  
         1px -1px 0  #000,
         -1px 1px 0  #000,
         1px 1px 0  #000;
    top: -1px;
    position: relative;
    width: calc(100% + 2px);
    left: -1px;
    cursor: move;
    z-index: 1;
}

#text_controller_inside .ddbc-tab-options--layout-pill{
    min-width: 25px;
    max-width: 75px;
    width: 75px;
    padding:1px
}
#text_controller_inside .sp-replacer,
#text_controller_inside select,
#text_controller_inside input{
    width:inherit;
    display:flex;
    flex-wrap: wrap;
    height: 25px;
    width:100%
}


#text_controller_inside {
    position: fixed;
    top: 555px;
    z-index: 1000;
    width: 240px;
    height: 170px;
}

#text_controller_inside .material-icons{
    font-size: 12px;
    left: calc(50% - 6px);
    position: relative;
}

.drawing-text-box{
    resize: none;
    height:calc(100% - 25px);
    width:100%;
    position: relative;
}
.text-input-inside:before{
    resize: none;
    content: attr(data-text);
    height: calc(100% - 25px);
    width: calc(100% - 2px);
    position: relative;
    z-index: 2;
    white-space: pre-wrap;
    overflow: hidden;
    background-color: transparent;
    text-decoration: none;
    text-shadow: none;
    padding: 0px;
    position: absolute;
    left: 1px;
    top: 26px;
    pointer-events: none;
    overflow-wrap: break-word;
    text-align:  var(--text-align);
    color: var(--color);
    font-family: var(--font-family);
    font-size: var(--font-size);
    line-height: var(--line-height);
    font-weight: var(--font-weight);
    font-style: var(--font-style);
}
  



#manual_grid_data>div>div:first-of-type{
    vertical-align: top;
    font-weight:bold;
}
#manual_grid_data>div{
    margin: 10px 0px;

}
.resize_drag_window .title_bar:after,
#text_controller_title_bar:after,
.text-input-title-bar:after,
#combat_tracker_title_bar:after {
    content: '';
    height: 8px;
    left: 0;
    right: 0;
    position: absolute;
    z-index: -1;
    bottom: -8px;
    background:  linear-gradient(to bottom, #0005 5%, #0000 40%);
}
#monster_title_bar_name,
#player_title_bar_name{
    font-size: 16px;
    line-height: 25px;
    font-weight: bold;
    text-align: left;
    width: 100%;
    color: #fff;
}

.resize_drag_window .title_bar .title_bar_close_button,
#text_controller_title_bar_exit,
.text-input-title-bar-exit,
.title-bar-exit,
#combat_tracker_title_bar_exit,
#monster_close_title_button,
#player_close_title_button,
#reload_player_frame_button,
#token_options_title_bar_exit,
.popout-button {
    fill: #fff5;
    filter: drop-shadow(1px 1px 1px #000e);
    cursor: pointer;
    background: #0000;
}
#reload_player_frame_button{
    fill:  #ddd;
}

#monster_close_title_button:hover,
#player_close_title_button:hover,
#reload_player_frame_button:hover,
.text-input-title-bar-exit:hover,
.title-bar-exit:hover,
.resize_drag_window .title_bar .title_bar_close_button,
#text_controller_title_bar_exit:hover,
#combat_tracker_title_bar_exit:hover,
#token_options_title_bar_exit:hover,
.popout-button:hover,
#combat_tracker_title_bar_settings:hover {
    background: #ddd3;
    transition: all linear 0.2s;
}

.text-input-title-bar-enter:hover {
    background: #ddd3;
    transition: all linear 0.2s;
    cursor: pointer;
}
 
.text-input-title-bar-exit svg,
.text-input-title-bar-exittitle-bar-exit svg,
.resize_drag_window .title_bar .title_bar_close_button svg,
#text_controller_title_bar_exit svg,
#combat_tracker_title_bar_exit svg,
#monster_close_title_button svg,
#player_close_title_button svg,
#reload_player_frame_button svg,
#token_options_title_bar_exit svg,
.popout-button svg{
    height: 20px;
    width: 20px;
}

.text-input-title-bar-exit svg g rect,
.title-bar-exit svg g rect,
.resize_drag_window .title_bar .title_bar_close_button svg g rect,
#text_controller_title_bar_exit svg g rect,
#combat_tracker_title_bar_exit svg g rect,
#monster_close_title_button svg g rect,
#player_close_title_button svg g rect,
#token_options_title_bar_exit svg g rect{
    height: 80px;
    width: 10px;
    fill: #ddd;
    transform: translate(45px, 10px);
}

.popout-button svg path:not([fill='none']){
    fill: #ddd;
}

.journal-button.popout-button svg path:not([fill='none']){
    fill: #878787; 
}

.journal-button.popout-button:hover svg path:not([fill='none']){
    fill: #000; 
}

.text-input-title-bar-enter {
    fill: #ddd;
    position: absolute;
    right: 30px;
    width: 20px;
    height: 20px;
    top: 2px;
}

.text-input-title-bar-exit,
.title-bar-exit,
.resize_drag_window .title_bar .title_bar_close_button,
#text_controller_title_bar_exit,
#combat_tracker_title_bar_exit,
#monster_close_title_button,
#player_close_title_button,
#token_options_title_bar_exit{
    position: absolute;
    right: 5px;
    width: 20px;
    height: 20px
}
#combat_tracker_title_bar_settings{
    position: absolute;
    right: 55px;
    width: 20px;
    height: 20px;
    top:0px;
}
.combat-settings-header input {
    border-radius: 5px;
    width: 45px;
}
#round_number_label .ctTimer {
    position: absolute;
    display: inline-flex;
    align-items: center;
    float: right;
    right: 5px;
}
#combat_tracker_title_bar_settings span{
    height: 20px;
    width: 20px;
    font-size: 20px;
    line-height: 25px;
    color: #ddd;
}
.popout-button {
    position: absolute;
    right: 30px;
    width: 20px;
    height: 20px
}
#reload_player_frame_button{
    position: absolute;
    right: 30px;
    width: 20px;
    height: 20px;
}

#monster_close_title_button,
#player_close_title_button,
#reload_player_frame_button,
.text-input-title-bar-exit,
.title-bar-exit,
.resize_drag_window .title_bar .title_bar_close_button,
#text_controller_title_bar_exit,
#combat_tracker_title_bar_exit,
#token_options_title_bar_exit,
.popout-button {
    top: 2px;
}
.ct-sidebar__inner .glc-game-log .abovevtt-sidebar-injected *{
    color: rgb(92, 112, 128);
}
.glc-game-log {
    max-width: 600px !important;
}
[class*="GameLogEntry-Other-Flex"] {
    height: fit-content !important;
}
.glc-game-log .popout-button{
    position: relative;
    display: inline; 
    padding-left: 3px;
    vertical-align: top;
    right: 0;
    filter: none;
}
.glc-game-log .popout-button path:not([fill='none']){
    fill: var(--theme-contrast);
    right: 0;
}
.glc-game-log [class*='-Result']>[class*='-Line-Title-'] {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: flex-start;
}

.glc-game-log [class*='-Result']>[class*='-Line-Title-']{
    visibility: hidden;
    font-size:0px;
}
.glc-game-log [class*='-Result']>[class*='-Line-Title-'] span{
    font-size:12px;
    max-width:100%;
    overflow:hidden;
    visibility: visible;
    text-overflow: ellipsis;
    white-space:nowrap;
}
.journal-button{
    filter: none;
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    font-weight: normal;
    position: absolute;
    right: 33px;
    top: 9px;
    width: 20px;
    height: 20px;
    border-radius: 3px;

}
.journal-button svg{
    padding: 2px 1px 2px 0px;
}
.body-rpgcharacter-sheet .popout-button.journal-button, 
.avtt-spectator-sheet .popout-button.journal-button {
    top: 6px;
}

#combat_tracker_inside #endplayerturn{
    pointer-events: none;
    background: #ddd;
    color: #888;
    opacity: 0.5;
    padding:0px;
}
.body-rpgcharacter-sheet #combat_tracker_inside #combat_footer,
.avtt-spectator-sheet #combat_tracker_inside #combat_footer{
    padding-top:5px;
}
#combat_tracker_inside #endplayerturn.enabled,
#combat_tracker_inside #endplayerturn.enabled:hover{
    pointer-events:all;
    color:#fff;
    background: #c53131;
    opacity: 1;
}
#combat_tracker_inside #endplayerturn.enabled:active{
    transform: translate(-1px, 1px);
    box-shadow: inset 1px 1px 4px 0px #0008;
}

#tokenOptionsPopup{
    position: fixed;
    z-index: 110000;
    background: #fff;
    border-radius: 10px;
    width: 245px;
    max-height: 100%;
}
.aboveDiceTotal{
    display: block;
    text-align: center;
    font-weight: 700;
    font-size: 23px;
    font-family: Roboto,Open Sans,Helvetica,sans-serif;
    color: rgb(92, 112, 128);
}
.aboveDiceOutput{
    width:181px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-family: "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    color: rgb(92, 112, 128);
    line-height: 1;
}

[class*='Line-Title'] .aboveDiceOutput .skill-tooltip{
    color: rgb(92, 112, 128) !important;
}

.abovevtt-roll-check,
.abovevtt-roll-skill{
    color: rgb(181, 93, 255);
}
.abovevtt-roll-save,
.abovevtt-roll-heal{
    color: rgb(108, 191, 91);
}
.abovevtt-roll-damage{
    color: rgb(223, 123, 123);
}
.abovevtt-roll-attack,
.abovevtt-roll-to-hit{
    color: rgb(27, 154, 240);
}
.abovevtt-roll-custom,
.abovevtt-roll-initiative,
.abovevtt-roll-roll{
    color: rgb(245, 166, 35);
}

.abovevtt-mon-stat-block__separator{
    max-width: 100%;
    max-height: 1rem;
    min-height: 10px;
    margin: 0px;
    background: url('https://media-waterdeep.cursecdn.com/file-attachments/0/579/stat-block-header-bar.svg') center center no-repeat;
}

#tokenOptionsContainer{
    overflow: hidden auto;
    padding: 5px;
    width: 100%;
    height: 100%;
}
#tokenOptionsContainer div, 
#tokenOptionsContainer h3 {
    font-size: 10px;
}
#tokenOptionsContainer h3,
.token-config-aura-wrapper .token-image-modal-footer-select-wrapper,
.token-image-modal-footer-title,
.menu-outer-aura,
.menu-inner-aura,
.menu-vision-aura {
    display: flex;
    align-self: center;
    line-height: 20px;
}   
.menu-outer-aura,
.menu-inner-aura,
.menu-vision-aura{
    margin: 2px 0px;
}
.menu-outer-aura .token-image-modal-footer-title,
.menu-inner-aura .token-image-modal-footer-title,
.menu-vision-aura .token-image-modal-footer-title{
    margin: 0px 3px 0px 8px;
    display: flex;
    justify-content: flex-end;
    text-align: end;
}

#tokenOptionsContainer div.token-image-modal-url-label-wrapper{
    display: flex;
    align-self: center;
    line-height: 20px;
    margin-top: 2px !important;
}
.context-menu-flyout,
#tokenOptionsContainer input:not([type="range"]),
#tokenOptionsContainer select{
    font-family: Roboto,Open Sans,Helvetica,sans-serif;
    padding: 1px 2px;
    font-size: 14px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}


div#tokenOptionsContainer button#adv{
    filter: sepia(0.3) hue-rotate(63deg) saturate(8) drop-shadow(0px 0px 0px #0F0);
    right:32px;
}

div#tokenOptionsContainer button#disadv{
    filter: sepia(0.3) hue-rotate(312deg) saturate(14) drop-shadow(0px 0px 0px #F00);
    right: 10px;
}

div#tokenOptionsContainer button#adv,
div#tokenOptionsContainer button#disadv{
    width:20px;
    background:none;
    outline:none;
    border:none;
    height:20px;
    position:absolute;
    opacity:0.2;
    padding:0px;
}
div#tokenOptionsContainer button#adv:hover,
div#tokenOptionsContainer button#disadv:hover{
    opacity:1;
}
div#tokenOptionsContainer button#adv:before,
div#tokenOptionsContainer button#disadv:before{
    width:100%;
    height:100%;
}

div#tokenOptionsContainer .remove-from-ct>button{
    display:none;
}
.context-menu-list{
    border-radius: 10px !important;
}
.context-menu-list li{
    background: none;
}

.menu-outer-aura h3,
.menu-inner-aura h3,
.menu-vision-aura h3{
    min-width: 51px;
    margin-top: 0px;
}

#round_number_label {
    position: relative;
    z-index:  1;
}
#round_number_label:before{
    content: '';
    left: 0;
    right: 0;
    height: 7px;
    position: absolute;
    z-index: -1;
    top: -7px;
    background: linear-gradient(to top, #0004 5%, #0000 40%);
}



#combat_tracker_inside .ui-resizable-ne,
#combat_tracker_inside .ui-resizable-se,
#combat_tracker_inside .ui-resizable-e{
    right: -7px;
}

#combat_tracker_inside .ui-resizable-nw,
#combat_tracker_inside .ui-resizable-sw,
#combat_tracker_inside .ui-resizable-w{
   left: -7px;
}
#combat_tracker_inside .ui-resizable-se{
    width: 10px;
    height: 10px;
}

.resize_drag_window .ui-resizable-s,
.resize_drag_window .ui-resizable-sw,
#resizeDragMon .ui-resizable-s,
#resizeDragMon .ui-resizable-sw,
#sheet .ui-resizable-s,
#sheet .ui-resizable-sw{
    bottom: -7px;  
}
.moveableWindow  .ui-resizable-handle {
    background: none;
    border: none;
    display: block;
    position: absolute;
}
.resize_drag_window .ui-resizable-se,
#resizeDragMon .ui-resizable-se,
#sheet .ui-resizable-se{
    height: 10px;
    width: 10px;
    right: -7px;
    bottom: -10px;
}
.resize_drag_window .ui-resizable-e,
.resize_drag_window .ui-resizable-w,
#resizeDragMon .ui-resizable-e,
#resizeDragMon .ui-resizable-w,
#sheet .ui-resizable-e,
#sheet .ui-resizable-w   {
    height: calc(100% + 4px);  
}

/*Resizable Handle Test code */
/*[class*="ui-resizable"]{
    border:  1px dotted #ddd;
}*/

[class*="ui-resizable"]
:is(#combat_area, #combat_area_carousel) tr td:last-of-type{
    padding-right: 5px;
}

#combat_tracker_inside{
    width: 295px;
}
/*End changes for UI*/

.body-rpgcharacter-sheet #combat_tracker_inside,
.avtt-spectator-sheet #combat_tracker_inside{
    border-radius: 5px;
}

:is(#combat_area, #combat_area_carousel) tr[data-current] td{
    background: none;  
}
:is(#combat_area, #combat_area_carousel) tr[data-current] td{  
    background: none;
    border: none;
}
:is(#combat_area, #combat_area_carousel) tr[data-current]{
    box-shadow: inset 0 0 50px 2px #1b9af0;
    border-radius: 6px;
    padding: 5px;
}
:is(#combat_area, #combat_area_carousel) tr td:last-of-type{
    border-bottom-right-radius: 8px;
    border-top-right-radius: 8px; 
}
:is(#combat_area, #combat_area_carousel) tr td:first-of-type{
    border-bottom-left-radius: 8px;
    border-top-left-radius: 8px;  
}

#combat_area tr[data-current][data-target*="characters"]{
    background: #0F0;  
}
#combat_area tr[data-current]:not([data-target*="characters"]){
    background: #0000;  
}

#combat_area tr[data-current] input{
    border-color: #1b9af0;
}
:is(#combat_area, #combat_area_carousel){
    border-collapse:collapse;  
}

#combat_area td input.init,
#round_number_label input{
    border-radius: 3px;
    border-color: #ddd;
    width: 39px !important;
    height: 19px;
    text-align: center;
    font-size: 13px !important;
}
#combat_area td input:not(.init){
    border-radius: 3px;
    border-color: #ddd;
    width: 100% !important;
    height:22px;
}
#combat_area td input.hp{
    text-align: right;
}

#combat_area td input.max_hp{
    text-align: left;
}

#round_number_label input{
    font-weight: 600;
    -moz-appearance: textfield !important;
}

:is(#combat_area, #combat_area_carousel) td button{
    vertical-align: middle;
    border-radius: 3px;
    padding: 2px;
    margin: 2px;
    border: 1px solid #ddd;
}

:is(#combat_area, #combat_area_carousel)td button{
    margin: -2px 1px
}
#site #combat_area tr td{
    padding-bottom: 4px;
}

:is(#combat_area, #combat_area_carousel) tr td div,
:is(#combat_area, #combat_area_carousel) tr td input.hp,
:is(#combat_area, #combat_area_carousel) tr td input.max_hp{
    top: 1px;
    position: relative;
    font-size: 18px !important; 
}

:is(#combat_area, #combat_area_carousel) tr td div.hp{
    float: right;  
}

#round_number_label{
    height: 30px;  
}

.VTTToken.freeform .hpbar:after {
    display: var(--token-hpbar-display);
    transition: none;
    position: absolute;
    width: 100%;
    visibility: visible;
    height: 6px;
    width: 100%;
    bottom: -6px;
    left: 0px;
    right: 0px;
    content: '';
    border: 1px solid #000;
    background-color: #0b0b0ddd !important;
    background-image: linear-gradient(to left, transparent calc(100% - var(--hp-percentage)), var(--token-hpbar-aura-color) 0%, var(--token-hpbar-aura-color) 100%) !important;
    box-shadow: inset 0px 0px 0px 1px var(--token-temp-hpbar), 0px 0px 3px 1px var(--token-temp-hpbar);
}
.VTTToken.freeform.notVisible .hpbar:after{
    visibility: hidden;
}
:is(#combat_area, #combat_area_carousel) td [class*="AvatarPortrait"]{
    border-radius: 5px;
    top:2px;
    left: 2px;
    position: relative;
    vertical-align: bottom;
}

:is(#combat_area, #combat_area_carousel) tr td{
    vertical-align: middle
}
:is(#combat_area, #combat_area_carousel) tr td{
    vertical-align: bottom
}

#round_number_label button{
    margin-left: 6px;
}
#round_number_label strong{
    margin-right: 2px;
    top: 1px;
    position: relative;
}
 #combat_tracker button:focus{
    outline: 1px solid #ddd;
}
:is(#combat_area, #combat_area_carousel) tr[data-current] td img{      
     box-shadow: 1px 1px 2px 0px #000000;  
}
#combat_area tr td input.init,
#combat_area tr td input:focus,
.roundNum,
:is(#combat_area, #combat_area_carousel) tr td img {
    box-shadow: 1px 1px 1px 0px #00000047;
}

#combat_tracker input[disabled=disabled], 
#combat_tracker input[disabled=disabled]:hover,
#combat_tracker input[readonly]{
    opacity: 1;
    border-style: solid;
}
:is(#combat_area, #combat_area_carousel) .selected-token td:first-of-type:before {
    content:'';
    width:35px;
    height:35px;
    top:2px;
    left:2px;
    border:2px solid #0000;
    position:absolute;
    border-radius:5px;
    box-shadow:  rgb(255 255 255) 0px 0px 1px 1px inset, rgba(192, 243, 255, 0.96) 0px 0px 1px 3px inset;
    z-index:1;
}
:is(#combat_area, #combat_area_carousel) .selected-token td:first-of-type .ac{
    z-index:2;
    position:absolute;
    display:block;
}
input.hp[disabled],
input.max_hp[disabled]{
    opacity: 1;
}

#combat_footer{
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
    padding-top: 13px;
}

.openEye path:not([fill*="none"]),
.closedEye path:not([fill*="none"]),
.hideSVG path:not([fill*="none"]),
.rollSVG path:not([fill*="none"]),
.findSVG path:not([fill*="none"]),
.delSVG path:not([fill*="none"]),
.statSVG path:not([fill*="none"]){
    fill: #1b9af0;
}

.findSVG path.cls-1{
    fill: transparent;
}

.openEye,
.closedEye,
.hideSVG,
.findSVG,
.delSVG,
.statSVG {
    width: 16px
}

.rollSVG{
    width: 17px;
    position: relative;
    bottom: 2px;
}

.hideFromPlayerCombatButton:after{
    content: 'Hide/Reveal in Combat Tracker for Players';
}
.rollInitiativeCombatButton:after{
    content:'Roll Initiative';         
}
.findTokenCombatButton:after{
    content:'Find Token';
}
.expandgroup:after{
    content:'Collapse Group';
}
.expandgroup.collapsed:after{
    content:'Expand Group';
}
.removeTokenCombatButton:after{
    content:'Remove from Combat';
}
.openSheetCombatButton:after{
    content:'Open Sheet';   
}

.combatHideFromPlayerInput{
    display: none;
}

.hideFromPlayerCombatButton:after,
.rollInitiativeCombatButton:after,
.findTokenCombatButton:after,
.removeTokenCombatButton:after,
.openSheetCombatButton:after{
    background: #444e;
    transition: 0.3s ease-in-out all;
    transition-delay: 0s;
    position: absolute;
    font-size: 14px;
    z-index: 59000;
    height: fit-content;
    padding: 3px;
    width: fit-content;
    white-space: nowrap;
    border-radius: 2px;
    text-shadow: 0px 1px 1px #000;
    display: block;
    opacity: 0;
    pointer-events: none;
}

:is(#combat_area, #combat_area_carousel) tr td div{
    line-height: 100%;
}

.hideFromPlayerCombatButton:hover:after,
.rollInitiativeCombatButton:hover:after,
.findTokenCombatButton:hover:after,
.removeTokenCombatButton:hover:after,
.openSheetCombatButton:hover:after {
    transition-delay: 0.7s;
    opacity: 1;
    color: #fff;
    pointer-events: none;
    right: 8px;
    border-radius: 5px;
}

.import-loading-indicator,
.paused-indicator,
.dm-paused-indicator{
    position: fixed;
    z-index: 100000;
    left: calc(50% - 170px);
    top: 50px;
    text-align: center;
    border-radius:20px;
    border:1px solid #000;
    box-shadow: 0px 0px 2px 2px #0008;
    background: #fff6;
    height: 112px;
    width: 200px;
    backdrop-filter: blur(6px);
}
.import-loading-indicator .loading-status-indicator__subtext{
    overflow: visible;
    white-space: nowrap;
    font-size:14px;
    position:relative;
    z-index:200;
    color:#ddd;
    top: 70px;
    text-shadow: 1px 1px 1px #000;
}
.import-loading-indicator .beholder-dm-screen{
    top: -20px;
}
.import-loading-indicator .loading-status-indicator__subtext.complete {
    overflow: visible;
    white-space: nowrap;
    transform: translate(-50%);
    left: 50%;
}

.paused-indicator,
.dm-paused-indicator{
    top: unset;
    bottom: 50px;
    height: 130px;
}
.paused-indicator .paused-status-indicator__subtext,
.dm-paused-indicator .paused-status-indicator__subtext{
    overflow: visible;
    white-space: nowrap;
    font-size:14px;
    position:relative;
    z-index:200;
    color:#ddd;
    top: 70px;
    text-shadow: 1px 1px 1px #000;
}

.paused-indicator g.beholder-dm-screen__screen path,
.dm-paused-indicator g.beholder-dm-screen__screen path,  
.import-loading-indicator g.beholder-dm-screen__screen path {
    fill: #201911;
    stroke: #0c0a08;
}
div#file-listing-section .sidebar-panel-loading-indicator {
    background: none !important;
    filter: drop-shadow(2px 2px 4px #000)
}
/*one button*/
.encounter-builder-page:not(.avtt-spectator-sheet) :is(#combat_area, #combat_area_carousel) td button:first-of-type:nth-last-of-type(1) {
    margin-right:60px;
}

/* two buttons */
.encounter-builder-page:not(.avtt-spectator-sheet) :is(#combat_area, #combat_area_carousel) td button:first-of-type:nth-last-of-type(2) ~ button:last-of-type {
    margin-right:30px;
}

/* three buttons */
.encounter-builder-page:not(.avtt-spectator-sheet) :is(#combat_area, #combat_area_carousel) td button:first-of-type:nth-last-of-type(3) ~ button:last-of-type {
    margin-right:0px;
}
/* four buttons */
.encounter-builder-page:not(.avtt-spectator-sheet) :is(#combat_area, #combat_area_carousel) td button:first-of-type:nth-last-of-type(4) ~ button:last-of-type {

    margin-right:0px;
}
.tracker-list{
    overflow: visible;
}
.openEye,
.closedEye,
.delSVG,
.findSVG,
.statSVG {
    bottom: 3px;
    position:relative;
}

.addCTSVG{
    padding: 4px;
    bottom: 1px;
}

#combat_tracker td button,
#combat_tracker td button svg{
    display: inline-block;
    vertical-align: middle;
} 
:is(#combat_area, #combat_area_carousel){
    width: 100%;
}
#combat_tracker_inside {
    height: 450px;
    z-index: 100000;
}
/*minimize windows*/

#darkness_layer.smooth-transition{
    transition: filter 350ms linear;
}

.minimized > *:not(#ct_text_title, .player_title, .monster_title, #text_controller_title, .title_bar_text),
.resize_drag_window .title_bar:after,
.resize_drag_window .title_bar.minimized ~ *,
#combat_tracker_title_bar.minimized:after,
#combat_tracker_title_bar.minimized ~ *{
    display: none !important;
}

#text_controller_title_bar.minimized,
#combat_tracker_title_bar.minimized,
#combat_tracker_title_bar.minimized,
.resize_drag_window .title_bar.minimized,
.resize_drag_window.minimized,
#resizeDragMon.minimized,
#sheet.minimized,
.minimized{
    border-radius: 5px;
    border: 1px solid #fffd;
    opacity: 1;
    filter: drop-shadow(1px 1px 1px #000);
    background-color: #24252788;
    backdrop-filter: blur(2px);
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    line-height: 25px;
    text-shadow: 0px 0px  #000,
        -1px -1px 0  #000,  
        1px -1px 0  #000,
        -1px 1px 0  #000,
        1px 1px 0  #000;
    padding-left: 3px;
}

.resize_drag_window .encounter-body{
    background: #fff;
    height: calc(100% - 25px);
    border-radius: 0px 0px 5px 5px;
}
.resize_drag_window .encounter-listing {
    max-height:calc(100% - 166px);
    width:100%;
    overflow:auto;
    padding:10px;
}
div#encounterRulesLine {
    float: right;
    display:inline-flex;
    align-items: center;
    position: absolute;
    justify-content: flex-end;
    right: 10px;
}

div#encounterRulesLine span{
    padding: 5px;
    font-weight:bold;
}
#encounterDifficultyLine span{
    padding:5px;
    font-weight:bold;
}
#encounterDifficultyLine{
    display:inline-flex;
    width: 100%;
    flex-wrap: wrap;
    flex-direction: column;
}
.encounter-listing :is(.token-row-gear, .token-row-add, .sidebar-list-item-row-item~*, .token-row-button, .sidebar-list-item-row[id^='/profile'] .sidebar-list-item-row-details-subtitle) {
    display: none;
}

.encounter-listing .sidebar-list-item-row.player-row{
    height:initial;
}
.encounter-body div#allyTitle {
    display:flex;
    font-weight:bold;
    justify-content: flex-end;
    padding:0px 20px;
}
.encounter-listing .removeItem svg.delSVG {
    width:24px;
    height:24px;
}
.encounter-listing .removeItem{
    width:24px;
    height:24px;
    margin-right:5px;
    display: flex;
    padding: 1px;
}
.encounter-body .xpLine.current{
    margin-top:20px;
}
.encounter-body :is(.xpLine, .difficultyLine).low span:nth-of-type(2) {
    color: #0055b6;
}
.encounter-body :is(.xpLine, .difficultyLine).mid span:nth-of-type(2) {
    color: #019d11;
}
.encounter-body :is(.xpLine, .difficultyLine).high span:nth-of-type(2) {
    color: #c48e05;
}
.encounter-body :is(.xpLine, .difficultyLine).deadly span:nth-of-type(2) {
    color: #620000;
}
#encounterRulesLine .rc-switch:before{
    width:fit-content;
}
#combat_tracker_inside{
    margin: 0px;
}
.minimized #text_controller_title,
.minimized .monster_title,
.minimized .player_title,
.minimized .title_bar_text,
.minimized #ct_text_title{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#combat_tracker_inside *:focus{
    outline: none;
}

[class$='NotRoot'] [class*='-MessageCarrot']{
    display:none;
}
[class$='NotRoot'] [class$='-MessageRoot']{
    transform: scale(0.8) translateX(-50%);
    left: calc(50% - 170px) !important;
    position:fixed;
    top:10px !important;;
    transform-origin: center;
}

/*end combat tracker face lift*/
.token>.base{
    background: #0000001c;
    backdrop-filter: blur(3px) brightness(0.7);
    z-index: -1;
    border: inset 5px var(--token-border-color, #ffffff44);
}
[data-notatoken].token>.base{
    border-width: calc(5px / var(--scene-scale));
}

.token>.base,
.token>.base ~ .hpvisualbar{
    width: 90%;
    height: 90%;
    position: absolute;
}




.VTTToken .base{
    filter: drop-shadow(0.5px 0px 1px #000b);
}
.token>.base.large-or-smaller-base{
    border-width: max(2px, calc(2px / var(--window-zoom)));
}

.token[data-notatoken]>.base.large-or-smaller-base{
    border-width: max(1px, calc(calc(1px / var(--window-zoom)) / 3));
}

.base.circle:before{
    content: "";
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    background: radial-gradient(transparent 68%, #000000 72%);
    border-radius: 50%;
    z-index: 1;
    position: absolute;
    display: block;
}
.base.large-or-smaller-base.circle:before{
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
}
[data-notatoken] .base.circle:before{
    top: min(-1px, calc(-4px / var(--scene-scale)));
    left: min(-1px, calc(-4px / var(--scene-scale)));
    right: min(-1px, calc(-4px / var(--scene-scale)));
    bottom: min(-1px, calc(-4px / var(--scene-scale)));
}
[data-notatoken] .base.large-or-smaller-base.circle:before{
    top: min(-1px, calc(-3px / var(--scene-scale)));
    left: min(-1px, calc(-3px / var(--scene-scale)));
    right: min(-1px, calc(-3px / var(--scene-scale)));
    bottom: min(-1px, calc(-3px / var(--scene-scale)));
}

.token>.token-image{
    --aura-width: max(2px, calc(2px / var(--window-zoom)));
    --zoom-border-width: max(calc(2px / var(--scene-scale)), calc(calc(var(--token-border-width) * 1.5) / var(--window-zoom)));
    border: var(--zoom-border-width, 4px) solid var(--token-border-color, #ffffff44);
    box-shadow: 0 0 var(--aura-width) var(--aura-width) var(--token-hp-aura-color), 0 0 var(--aura-width) calc(var(--aura-width) * 2) var(--token-temp-hp);
}
button.dropboxChooser{
    padding-left: 18px !important;
    position: relative;
}

button.dropboxChooser.token-row-button{
    position: relative;
    padding-left: 0px !important;
    display:inline-block;
}

button.dropboxChooser.token-row-button span.dropin-btn-status{
    background-size: 100px 20px;
    left: 1px;
    width: 26px;
    position: relative;
    display: block;
    height: 20px;
}

.sidebar-list-item-row-item button.dropboxChooser.token-row-button span.dropin-btn-status{
    background-image: none;
    -webkit-mask-image: url(https://www.dropbox.com/static/metaserver/static/images/widgets/dbx-saver-status-2x.png);
    -webkit-mask-size: 100px 20px;
    -webkit-mask-position: 50px 0px;
    mask-image: url(https://www.dropbox.com/static/metaserver/static/images/widgets/dbx-saver-status-2x.png);
    mask-size: 100px 20px;
    mask-position: 50px 0px;
    background: #000;
}
button span.dropin-btn-status{
    background-image: url(https://www.dropbox.com/static/metaserver/static/images/widgets/dbx-saver-status-2x.png);
    background-size: 60px 14px;
    -webkit-background-size: 60px 14px;
    width: 15px;
    position: absolute;
    height: 15px;
    left: 2px;
}

button.launchPicker{
    padding-left: 18px !important;
    position: relative;
}

button.launchPicker.token-row-button{
    position: relative;
    padding-left: 0px !important;
    display:inline-block;
}

button.avttPicker {
    padding-left: 18px !important;
    position: relative;
}

button.avttPicker.token-row-button {
    position: relative;
    padding-left: 0px !important;
    display: inline-block;
}
button.avttPicker.token-row-button span.avtt-btn-status {
    left: 1px;
    width: 26px;
    position: relative;
    display: block;
    height: 20px;
}

button span.avtt-btn-status {
    background-image: var(--avtt-mask);
    -webkit-background-position: 0px 2px;
    background-position: 0px -2px;
    background-size: 100%;
    width: 25px;
    position: absolute;
    height: 25px;
    left: 2px;
    top: 0;
    background-repeat: no-repeat;
}

#edit_scene_form button span.avtt-btn-status{
    background-position: 0px 0px;
    width: 20px;
    height: 20px;
    left: 0px;
}
.sidebar-list-item-row-item button.avttPicker.token-row-button span.avtt-btn-status {
    background-image: none;
    -webkit-mask-image: var(--avtt-mask);
    -webkit-mask-size: 30px 30px;
    -webkit-mask-position: -2px -1px;
    mask-image: var(--avtt-mask);
    mask-size: 30px 30px;
    mask-repeat: no-repeat;
    mask-position: -2px -1px;
    background: #000000;
}

button.launchPicker.token-row-button span.onedrive-btn-status{
    left: 1px;
    width: 26px;
    position: relative;
    display: block;
    height: 20px;
}
button span.onedrive-btn-status{
    background-image: var(--onedrive-svg);
    -webkit-background-position: 0px 2px;
    background-position: 0px 2px;
    width: 15px;
    position: absolute;
    height: 15px;
    left: 2px;
    background-repeat: no-repeat;
}
.sidebar-list-item-row-item button.launchPicker.token-row-button span.onedrive-btn-status{
    background-image: none;
    -webkit-mask-image: var(--onedrive-mask);
    -webkit-mask-size: 25px 17px;
    -webkit-mask-position: 0px 2px;
    mask-image: var(--onedrive-mask);
    mask-size: 25px 17px;
    mask-repeat: no-repeat;
    mask-position: 0px 2px;
    background: #000;
}
#sounds-panel button.dropboxChooser, 
#sounds-panel button.launchPicker, 
#sounds-panel button.avttPicker{
    width: 23px;
    padding: 0px !important;
    height: 21px;
}
#sounds-panel button.dropboxChooser span,
#sounds-panel button.launchPicker span,
#sounds-panel button.avttPicker span{
    top: 2px;
}
#sounds-panel button span.avtt-btn-status {
    background-position: -2px -2px;
    top: 0px;
    left: 0px;
    background-size: 24px;
    width: 100%;
    height: 100%;
}
#sounds-panel .sidebar-panel-body>button{
    vertical-align:top;
}
#journal-panel .addTokenMenu button {
    height: 28px;
}
.addTokenMenu {
    display: flex;
    width: 34px;
    overflow: hidden;
    transition: 250ms width 0ms;
    flex-direction:row-reverse;
    flex-shrink:0;
}

.sidebar-list-item-row-details{
    flex-shrink: 1;
}

.addTokenMenu:hover,
.hover-add-button:hover~.addTokenMenu {
    width: 136px;
    flex-shrink: 0;
}

.addTokenMenu button {
    display: inline-block;
    height: 100%;
    margin: 0px 2px;
}

.token>.token-image{
    min-height: var(--min-height) !important;
    min-width: var(--min-width) !important;
    max-height: var(--max-height) !important;
    max-width: var(--max-width) !important;
}
.token[data-notatoken]>.token-image{
    min-height: calc(var(--min-height) / var(--scene-scale)) !important;
    min-width: calc(var(--min-width) / var(--scene-scale)) !important;
    max-height: calc(var(--max-height) / var(--scene-scale)) !important;
    max-width: calc(var(--max-width) / var(--scene-scale)) !important;
}
#token_map_items .token[data-notatoken]>.token-image{
    --aura-width: max(calc(1px / var(--scene-scale)), calc(calc(2px / var(--scene-scale)) / var(--window-zoom)));
    --zoom-border-width: max(1px, calc(calc(var(--token-border-width) * 1.5) / var(--window-zoom)));
    border: var(--zoom-border-width, 1px) solid var(--token-border-color, #ffffff44);
    box-shadow: 0 0 var(--aura-width) var(--aura-width) var(--token-hp-aura-color), 0 0 var(--aura-width) calc(var(--aura-width) * 2) var(--token-temp-hp);
}
#VTT .token>.base~.token-image,
#token-configuration-modal .token>.base~.token-image
{
    filter: none;
    border: 0px;
    box-shadow: none;
}

#VTT .token.isAoe .token-image,
#token-configuration-modal .token.isAoe .token-image{
  border: 0px;
}

#token_map_items .token:before {
    display: none;
}

.base.circle,
.base.circle:after{
    border-radius: 50%;
}

#VTT .token>.token-image.freeform,
#token-configuration-modal .token>.token-image.freeform{
    border: 0px;
    box-shadow: none;
    min-height: 0px;
    min-width: 0px;
    --aura-width: max(1px, calc(1px / var(--window-zoom)));
    filter:  drop-shadow(var(--token-border-color) 0px 0px var(--aura-width)) 
    drop-shadow(var(--token-hp-aura-color) 0px 0px var(--aura-width)) 
    drop-shadow(var(--token-temp-hp) 0px 0px var(--aura-width))
}
#VTT #tokens .token.underDarkness>.token-image.freeform{
    filter:none;
}
#VTT .token[data-notatoken]>.token-image.freeform, 
#token-configuration-modal .token[data-notatoken]>.token-image.freeform{
    --aura-width: max(calc(1px / var(--scene-scale)), calc(calc(1px / var(--scene-scale)) / var(--window-zoom)))
}

.token[data-notatoken]>.token-image.freeform {
    --aura-width: max(calc(1px / var(--scene-scale)), calc(calc(1px / var(--scene-scale)) / var(--window-zoom)))
}
.token>.token-image:not(.preserve-aspect-ratio) {
    object-fit: cover;
    width: 100%;
    height: 100%;
} 
.token>.token-image{
    object-position: var(--offsetX, center) calc(-1 * var(--offsetY, top));
    object-view-box: var(--view-box);
    opacity: var(--image-opacity);
}

.base:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: 30%;
    opacity: 1;
    --aura-width: max(5px, calc(5px / var(--window-zoom)));
    box-shadow: inset 0 0 var(--aura-width) var(--aura-width) var(--token-hp-aura-color), inset 0 0 var(--aura-width) calc(var(--aura-width) * 2) var(--token-temp-hp);

}
[data-notatoken] .base:after{
    --aura-width:max(calc(5px / var(--scene-scale)), calc(calc(5px / var(--scene-scale)) / var(--window-zoom)));
}

.base.large-or-smaller-base:after{
    --aura-width: max(2px, calc(2px / var(--window-zoom)));
    box-shadow: inset 0 0 var(--aura-width) var(--aura-width) var(--token-hp-aura-color), inset 0 0 var(--aura-width) calc(var(--aura-width) * 2) var(--token-temp-hp);
}

[data-notatoken] .base.large-or-smaller-base:after{
    --aura-width: max(calc(2px / var(--scene-scale)), calc(calc(2px / var(--scene-scale)) / var(--window-zoom)));
}


.VTTToken.token>.base.circle{
    border-style: solid;
}
.base.border-color-base{
    background: var(--token-border-color, #ffffff44);
    backdrop-filter: blur(2px) brightness(0.9) opacity(0.8);
}
.base.grass-base:after,
.token>.base.grass-base{
    background-image: url(https://opengameart.org/sites/default/files/ground_grass_gen_07.png);
}
.base.tile-base:after,
.token>.base.tile-base{
    background-image: url(https://opengameart.org/sites/default/files/textureStone_0.png);
}
.base.sand-base:after,
.token>.base.sand-base{
    background-image: url(https://opengameart.org/sites/default/files/dirt4.png);
}
.base.rock-base:after,
.token>.base.rock-base{
    background-image: url(https://opengameart.org/sites/default/files/Rockface%20red_0.png);
}
.base.water-base:after,
.token>.base.water-base{
    background-image: url(https://opengameart.org/sites/default/files/Untitled-3_1.jpg);
}
.token.hasbase.ui-draggable-dragging .base,
.token.hasbase.pause_click .base{
    filter: drop-shadow(3px 3px 2px #000000dd)
}
.token.hasbase.ui-draggable-dragging .base.large-or-smaller-base,
.token.hasbase.pause_click .base.large-or-smaller-base{
    filter: drop-shadow(1px 1px 2px #000000dd)
}
.token.hasbase.ui-draggable-dragging,
.token.hasbase.pause_click{
    transform: translate(-1px, -1px)
}

#tokenWrapper__tokenStyleSelect,
#tokenWrapper__tokenBaseStyleSelect{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#tokenWrapper__tokenBaseStyleSelect{
    transition: height 1500ms linear 0s;
    overflow: hidden;
}

.image-size-wrapper,
.border-color-wrapper {
    display: block !important;
}

.token-config-aura-wrapper{
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
}
.image-size-title,
.border-color-title {
    display:  inline-block !important;
}
#aoe_feet_height,
.image-scale-input-number,
.image-input-number {
    float: right;
    padding-left: 5px !important;
    width: 48px !important;
    height: 24px !important;
    margin-bottom: 2px !important;
}
.sp-cf:after, .sp-cf:before{
    display:none !important;
}
#sources-import-content-container .sp-container{
    position: fixed !important;
}
.sp-replacer.sp-light{
    float:  right;
    width: 48px;
    height: 24px;
    border-radius: 5px;
    padding: 0;
}

.lightRowLabel{
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1.4;
    margin: 4px 6px 2px 2px;
    display: inline-block;
}

.lightRow{
    width:100%; 
    display:flex;
}
.lightRowInput{
    flex-grow:1;
}
.lightRow .sp-replacer.sp-light{
    float:left;
}
.image-scale-input-range,
.image-input-range{
    width: 100%;
}
.flyout-from-menu-item,
#tokenOptionsContainer>button,
#tokenOptionsContainer>div>button,
#notes-flyout button,
#adjustments-flyout>div>button {
    line-height: 24px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-top: 2px;
}

#tokenOptionsContainer>button,
#notes-flyout button,
#adjustments-flyout>div>button  {
    background: none;
    font-size: 10px;
    display: flex;
    flex-direction: row;
    width: 100%;    
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-left: 26px;
    height: 24px;
    color: #738694;
    font-family: Roboto,Open Sans,Helvetica,sans-serif;
}
#tokenOptionsContainer .menu-input {
    width: 50px;
    text-align: center;
    margin: 5px;
}
.menu-input-label{
    text-align: center;
    background: none;
    font-size: 10px;   
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    height: 24px;
    color: #738694;
    font-family: Roboto,Open Sans,Helvetica,sans-serif;
}

#menuStatDiv {
    width: 100%; 
    padding: 5px;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;
    margin-bottom: 15px;
}


#tokenOptionsContainer .material-icons{
    color: #738694;
}
#tokenOptionsContainer>button:hover .material-icons {
    color: #ddd;
}
#tokenOptionsContainer>button:hover,
#notes-flyout button:hover,
#adjustments-flyout>div>button:hover   {
    background-color: rgba(41, 128, 185);
    color: #ddd;
}
#tokenOptionsContainer>button.deleteMenuButton:hover{
    background-color: #D33;
}


#tokenOptionsContainer>button.deleteMenuButton:before{
    color: #738694 !important;;
}
#tokenOptionsContainer>button.deleteMenuButton:hover:before{
    filter: drop-shadow(0px 0px 2px #000d);
    color: #ddd !important;
}
#tokenOptionsContainer>button.deleteMenuButton {
    border-top: 1px solid #ddd;
    margin-top: 5px;
}
#tokenOptionsContainer button:before{
    width: 20px;
    height: 20px;
}

button#changeTokenImage:before{
   content: "\e413"; 
}


.chat-text-wrapper.sidebar-hover-text.invalidExpression:before{
    content: attr(data-content);
    display: block;
    position: relative;
    top: 0;
    opacity: 1;
    white-space: pre-wrap;
    max-width:100%;
}

#conditions-flyout li{
    font-size: 14px;
}
#conditions-flyout li.icon-close-red:before{
    font-size: 24px;
    margin: 0px;
    left: -5px;
}

.flyout-from-menu-item:hover {
    background-color: rgba(41, 128, 185);
}

.flyout-from-menu-item:hover > .token-image-modal-footer-title {
    color: #ddd;
}

.flyout-from-menu-item:after {
    position: relative;
    content: '';
    right: 5px;
    top: 7px;
    width: 0; 
    height: 0; 
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent; 
    border-left: 5px solid #738694;
}
.flyout-from-menu-item:hover:after {
    border-left: 5px solid #ddd;
}
.button-refresh.material-symbols-outlined {
    margin: 0px 0px 0px 2px !important;
    background: none;
    font-size: 18px;
    display: flex;
    flex-direction: row;
    width: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    height: 26px;
    color: #738694;
    padding: 0px;
}
.ui-dialog .ui-dialog-titlebar{
    display:block;
}
.context-menu-flyout{
    visibility: hidden;
    transition: visibility 0s;
    transition-delay: 1000ms;
}

.flyout-from-menu-item:hover ~ .context-menu-flyout,
#tokenOptionsPopup.touch .context-menu-flyout,
.context-menu-flyout:hover,
.context-menu-flyout:focus-within {
    visibility: visible;
    transition-delay: 0ms;
}


.hponhover {
    visibility:  hidden !important;
    transition:  0.2s ease-in-out 0.5s;
}
.token:hover .hponhover:not([style*='visibility: hidden']),
.token:focus-within .hponhover:not([style*='visibility: hidden']),
.tokenselected .hponhover:not([style*='visibility: hidden']) {
    visibility:  visible !important;
    transition:  0.05s ease-in-out 0.3s
}


#prewiz, 
#wizard_popup{
    z-index: 58000;
}

#character-tools-target{
    z-index: unset !important; /*important to override dndbeyond's index.scss*/
}


.dm_scenes_button.selected,
.player_scenes_button.selected,
.dm_scenes_button.selected:hover,
.player_scenes_button.selected:hover{
    background: #ff7f7f;
}

.scene .dm_scenes_button,
.scene .player_scenes_button {
    transition: none;
}

#tokens {
    z-index: 40;
}
#tokenOptionsPopup>#tokenOptionsContainer>div[data-option-name='lockRestrictDrop'] select{
    background: none !important;
    max-width:unset;
    min-width: unset;
    width:100%;
    padding-left:20px;
    font-family: Roboto, Open Sans, Helvetica, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 5px 0px 5px 22px;
    font-size:10px;
    color: #738694;
    margin-top:2px;
    height: 24px;
}
#tokenOptionsPopup>#tokenOptionsContainer>div[data-option-name='lockRestrictDrop'] .door-lock {
    position:absolute;
    left:-6px;
    padding:3px 0px;
    font-size:16px;  
}
.isAoe .hpvisualbar{
    display: none !important;
}
.ct-character-sheet__inner,
.ct-sidebar__inner *,
.moveableWindow *,
.sidebar .sidebar-panel-body,
.sidepanel-content [class*='-GameLog'],
.sidebar-flyout,
#mixer-channels,
.note,
.sources-import-main-container *,
.sidebar-modal{
    overscroll-behavior: contain;
    & div.ct-item-detail__description{
        overflow: visible;
        height: auto;
    }
}

.glc-game-log div[class|='tss'][class$='-GameLog'] {
    overflow-x:hidden;
}

[class*='styles_gameLogPane'] *{
    overscroll-behavior: auto;
}
.VTTToken:not(.freeform) .hpvisualbar:before{
    display: var(--token-hpbar-display);
    transition: none;
    position: absolute;
    visibility: visible;
    z-index: -1;
    filter: blur(1px);
    content:'';
    --mask-size:calc(98% - 2px / var(--window-zoom));
}
.VTTToken:not(.freeform).notVisible .hpvisualbar:before{
    visibility: hidden;
}

.VTTToken[data-notatoken]:not(.freeform) .hpvisualbar:before{
    --mask-size:calc(98% - calc(2px / var(--scene-scale)) / var(--window-zoom));
}

.VTTToken:not(.freeform):not(.hasbase) .hpvisualbar:before{
    --mask-size:calc(100% - 7px);
    border-radius: 50%;
    transform: scale(var(--token-scale)) rotate(calc(var(--token-rotation) + var(--token-heading))) scaleX(var(--image-flip-x, 1));
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    background-color: #000;
    background-image: conic-gradient(transparent calc(100% - var(--total-percentage)), 
                            var(--token-temp-hpbar) calc(100% - var(--total-percentage)) calc(100% - var(--hp-percentage)), 
                            var(--token-hpbar-aura-color) calc(100% - var(--hp-percentage)) 100%) !important;
    clip-path: circle();
    -webkit-mask: radial-gradient(45% 45% at center,transparent var(--mask-size),#fff var(--mask-size) 105%);
    mask:radial-gradient(45% 45% at center,transparent var(--mask-size),#fff var(--mask-size) 105%);
}
.VTTToken.square:not(.freeform):not(.hasbase) .hpvisualbar:before{
    border-radius:0px;
}

.VTTToken[data-notatoken]:not(.freeform):not(.hasbase) .hpvisualbar:before,
.VTTToken.underDarkness:not(.freeform):not(.hasbase) .hpvisualbar:before{
    --mask-size: calc(100% - calc(7px / var(--scene-scale)));
}

.VTTToken.square:not(.freeform):not(.hasbase) .hpvisualbar:before {
    -webkit-mask: linear-gradient(to left, #0000 var(--mask-size), #000 var(--mask-size) 95%), linear-gradient(to top, #0000 var(--mask-size), #000 var(--mask-size) 95%), linear-gradient(to bottom, #0000 var(--mask-size), #000 var(--mask-size) 95%), linear-gradient(to right, #0000 var(--mask-size), #000 var(--mask-size) 95%);
    clip-path:none;
}

.VTTToken .base ~ .hpvisualbar:before {
    border-radius:50%;
    background-size: 100%;
    background-color: transparent;
    background-image: conic-gradient(transparent calc(100% - var(--total-percentage)), 
                        var(--token-temp-hpbar) calc(100% - var(--total-percentage)) calc(100% - var(--hp-percentage)), 
                        var(--token-hpbar-aura-color) calc(100% - var(--hp-percentage)) 100%) !important;
    clip-path: circle();
    -webkit-mask: radial-gradient(45% 45% at center,transparent var(--mask-size),#fff 105%);
    mask:radial-gradient(45% 45% at center,transparent var(--mask-size),#fff 105%);
    box-shadow:none;
    z-index: -1;
}

.VTTToken .base.square ~ .hpvisualbar:before {
     border-radius:0px;
    --mask-size: calc(95% - 2px / var(--window-zoom));
    -webkit-mask: linear-gradient(to left, #0000 var(--mask-size), #000 95%), linear-gradient(to top, #0000 var(--mask-size), #000 95%), linear-gradient(to bottom, #0000 var(--mask-size), #000 95%), linear-gradient(to right, #0000 var(--mask-size), #000 95%);
    clip-path: none;
}

.VTTToken[data-notatoken] .base.square ~ .hpvisualbar:before{
    --mask-size:calc(95% - calc(2px / var(--scene-scale)) / var(--window-zoom));
}
.VTTToken .base ~ .hpvisualbar:before {
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
}
.VTTToken[data-notatoken] .base ~ .hpvisualbar:before {
   top: max(1px, calc(4px / var(--scene-scale)));
   left: max(1px, calc(4px / var(--scene-scale)));
   right: max(1px, calc(4px / var(--scene-scale)));
   bottom: max(1px, calc(4px / var(--scene-scale)));
}
.VTTToken .base.large-or-smaller-base ~ .hpvisualbar:before {
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
}
.VTTToken[data-notatoken] .base.large-or-smaller-base ~ .hpvisualbar:before {
    top: max(1px, calc(2px / var(--scene-scale)));
    left: max(1px, calc(2px / var(--scene-scale)));
    right: max(1px, calc(2px / var(--scene-scale)));
    bottom: max(1px, calc(2px / var(--scene-scale)));
}
.hpvisualbar{
    pointer-events: none;
}

.stream-dice-button {
    display: flex;
    box-shadow: 1px 1px 1px 1px #0003, 1px 2px 0px -2px #0003;
    border: 1px solid transparent;
    box-sizing: border-box;
    border-radius: 2px;
    text-align: right;
    position: absolute;
    width: 88px;
    top: 11px;
    left: 250px;
    height: fit-content;
    font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 11px;
    line-height: 13px;
    -webkit-box-align: center;
    align-items: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgb(111, 116, 120);
    padding: 0px 2px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: #9c2727;
    opacity: 0.8;
}

body {
    --crit-success: #0a0;
    --crit-fail: #a00;
    --crit-mixed: #4768ff;
}

body.color-blind-avtt {
    --crit-success: #ffff00;
}

[class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] .aboveDiceTotal,
[class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] .aboveDiceTotal {
    color: var(--crit-success) !important;
}

.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] span,
.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] span,
.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*="TotalContainer-Flex"] .aboveDiceTotal,
.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] span,
.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] span,
.color-blind-avtt [class*="glc-game-log"] .crit-success div[class*='DiceMessage_TotalContainer'] .aboveDiceTotal {
    --text-shadow-color: color-mix(in srgb, #000 100%, var(--crit-success) 50%);
    text-shadow: 1px 1px var(--text-shadow-color), -1px -1px var(--text-shadow-color), -1px 1px var(--text-shadow-color), 1px -1px var(--text-shadow-color), 2px 2px 2px var(--text-shadow-color);
}

[class*="glc-game-log"] .crit-fail div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-fail div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-fail div[class*="TotalContainer-Flex"] .aboveDiceTotal,
[class*="glc-game-log"] .crit-fail div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-fail div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-fail div[class*='DiceMessage_TotalContainer'] .aboveDiceTotal {
    color: var(--crit-fail) !important;
}

[class*="glc-game-log"] .crit-mixed div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-mixed div[class*="TotalContainer-Flex"] span,
[class*="glc-game-log"] .crit-mixed div[class*="TotalContainer-Flex"] .aboveDiceTotal,
[class*="glc-game-log"] .crit-mixed div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-mixed div[class*='DiceMessage_TotalContainer'] span,
[class*="glc-game-log"] .crit-mixed div[class*='DiceMessage_TotalContainer'] .aboveDiceTotal {
    color: var(--crit-mixed) !important;
}

[class*="glc-game-log"] div[class*="TotalContainer-Flex"] .custom-spell-save-text span,
[class*="glc-game-log"] div[class*='DiceMessage_TotalContainer'] .custom-spell-save-text span {
    color: #716f6f !important;
    font-size: 10px;
    font-weight: bold;
    line-height: 10px;
    text-wrap: nowrap;
}

[class*="glc-game-log"] div[class*='DiceMessage_TotalContainer'] .custom-spell-save-text {
    line-height: 13px;
}

[class*="glc-game-log"] div[class*='DiceMessage_TotalContainer']>div[class*='DiceMessage_Total'] {
    position: relative;
    align-self: stretch;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
}

.glc-game-log>div>div[class*="-Title"] {
    margin-bottom: 7px;
}
.glc-game-log .ct-sidebar__heading span:not([class*='uncommon'], [class*='rare'], [class*='very-rare'], [class*='legendary'], [class*='artifact']),
.glc-game-log .ddbc-property-list span{
    color: rgb(92, 112, 128);
}
.glc-game-log .ddbc-pencil-svg {
    display: none;
}
.glc-game-log .ddbc-concentration-icon, 
.glc-game-log .ddbc-ritual-icon,
.glc-game-log [class*='styles_ritualIcon'],
.glc-game-log [class*='styles_concentrationIcon']
{
    display: inline-block;
    margin-left: .188rem;
}
.glc-game-log [class*='styles_concentrationIcon'] rect {
    transform: translate(-4.18px, 10.09px) rotate(-45deg) !important;
}
.glc-game-log [class*='styles_concentrationIcon'] [class*='styles_svg'],
.glc-game-log [class*='styles_ritualIcon'] [class*='styles_svg']{
    height: .75rem;
    margin-right: 0;
    width: .75rem;
}
.stream-dice-button:hover {
    cursor: pointer;
    background: rgb(245, 248, 250);
    border: 1px solid rgb(206, 217, 224);
}

.stream-dice-button:hover:after {
    width: fit-content;
    height: fit-content;
    cursor: pointer;
    background: rgb(245, 248, 250);
    border: 1px solid rgb(206, 217, 224);
    visibility: visible;
}

.stream-dice-button:active {
  background-color: rgb(245, 248, 250);
  box-shadow: none;
  transform: translate(1px, 2px);
}

.stream-dice-button.enabled{
    color: rgb(111, 116, 120);
    box-shadow: 1px 1px 1px -1px #0003, 1px 2px 0px -2px #0003;
}
.stream-dice-button:hover:after { 
    opacity:1;
    transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1) 500ms, background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;  
}

.stream-dice-button:after{
    content: 'Click to join the dice stream';
    position:fixed;
    width: fit-content;
    height: fit-content;
    background: rgb(245, 248, 250);
    border: 1px solid rgb(206, 217, 224);
    top:80px;
    right:0px;
    z-index:80000;
    opacity:0;
    color: rgb(0 0 0);
    visibility: hidden;
    pointer-events: none;
}

.stream-dice-button.enabled:hover:after {
    opacity:1;
    transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1) 500ms, background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;   
}

.stream-dice-button.enabled:after {
    content: 'Click to leave the dice stream';
}
.stream-dice-button:active:after{
    display:none;
}
.icon-concentration-reminder:before,
.icon-reaction-used:before,
.icon-inspiration:before,
.icon-flying:before,
.icon-burning:before,
.icon-rage:before,
.icon-blessed:before,
.icon-baned:before,
.icon-bloodied:before,
.icon-advantage:before,
.icon-disadvantage:before,
.icon-bardic-inspiration:before,
.icon-hasted:before,
.context-menu-icon-concentration-reminder:before,
.context-menu-icon-inspiration:before,
.context-menu-icon-flying:before,
.context-menu-icon-burning:before,
.context-menu-icon-rage:before,
.context-menu-icon-blessed:before,
.context-menu-icon-baned:before,
.context-menu-icon-bloodied:before,
.context-menu-icon-advantage:before,
.context-menu-icon-disadvantage:before,
.context-menu-icon-bardic-inspiration:before,
.context-menu-icon-hasted:before {
    background-position: center;
}

.markers-icon>input[type='text']{
    position: relative;
    max-width: 68%;
}

.custom-condition-text{
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    fill: #fff;
    stroke: #000;
    text-anchor: middle;
    alignment-baseline: text-before-edge;
    transform: translate(50%, 0%);  
    paint-order: stroke;
    text-shadow: 1px 1px 2px #000;
    pointer-events:none;
}
.custom-condition.text{
    pointer-events:auto;
}
.condition-img svg {
    width:100%;
    height:100%;
    border-radius:50%;    
}

.duration-badge {
    position: absolute;
    width: max(8px, 50%);
    height: max(8px, 50%);
    font-weight: bold;
    border: 1px solid #959595;
    top: -5%;
    right: -5%;
    border-radius: 50%;
    color: #fff;
    display: flex;
    background: #1c1c1c;
    container-type: inline-size;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.duration-badge.expired span{
    color: #F00;
}
.duration-badge span{
    font-size: 110cqw;
    line-height: 100%;
}

.badge {
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    vertical-align: middle;
    max-width: 100%;
    background-color: rgba(18,24,28,0.12);
    border-radius: 4px;
    height: 24px;
    position: relative;
    font-family: Roboto,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
    cursor: help
}

.badge+i,.badge+* {
    margin-left: 8px
}

.tooltip .badge {
    background-color: #E3E3E4
}

p .badge {
    margin-left: 0
}

.badge-label {
    color: #12181C;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 7px;
    white-space: nowrap
}

.badge-tooltip {
    min-width: 370px;
    top: 40px;
    left: 50%;
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);
    padding: 6px 10px;
    color: #FFF;
    background-color: #374045;
    font-weight: normal;
    font-size: 13px;
    border-radius: 2px;
    position: absolute;
    z-index: 99999999;
    box-sizing: border-box;
    transition: 0s all;
    transition-delay: .5s;
    visibility: hidden;
    cursor: text;
    font-size: 14px;
    text-align: center;
    z-index: 4
}

.badge-tooltip.badge-only {
    min-width: 165px
}

.badge:hover .badge-tooltip,.badge:focus .badge-tooltip,.badge-label .badge-tooltip,.badge-label .badge-tooltip {
    transition-delay: 0s;
    visibility: visible
}

.badge-text {
    display: inline!important;
    margin-right: 4px;
    color: #FFF
}

.badge-cta {
    color: #64B6F7!important;
    text-decoration: underline!important
}
.button-loading::after {
    content: "";
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0;
    left: 10px;
    bottom: 0;
    margin: auto;
    border: 4px solid transparent;
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: button-loading-spinner 1s ease infinite;
}
@keyframes button-loading-spinner {
    from {
        transform: rotate(0turn);
    }
    to {
        transform: rotate(1turn);
    }
}

.token img[src*='https://www.googleapis.com/drive/v3/files/1_QnkvmGct2dzeu-pBO9ofT-828pWvCcn?alt=media&key=AIzaSyBcA_C2gXjTueKJY2iPbQbDvkZWrTzvs5I'] {
    background:#ffffff80;
    border-radius:20px !important;
    border: var(--token-border-width) solid #000 !important;
}

.video-listing{
    width: 38px;
}
.body-rpgcampaign .ddb-campaigns-invite-primary {
    filter: blur(6px);
    transition: 0ms filter 200ms;
}
.ct-character-sheet__inner[style*='width: 620px'] #avtt-character-join-button,
.ct-character-sheet__inner[style*='width: 550px'] #avtt-character-join-button{
  display:none;
}
.ct-character-sheet__inner[style*='width: 620px'] .ct-combat__summary-group--statuses,
.ct-character-sheet__inner[style*='width: 550px'] .ct-combat__summary-group--statuses{
    max-width:380px;
}
.ct-character-sheet__inner[style*='width: 620px'] .ct-character-header-desktop,
.ct-character-sheet__inner[style*='width: 620px'] .ct-subsections,
.ct-character-sheet__inner[style*='width: 550px'] .ct-character-header-desktop,
.ct-character-sheet__inner[style*='width: 550px'] .ct-subsections {
    padding-right: 30px !important;
}

.body-rpgcampaign .ddb-campaigns-invite-primary:active {
    filter: none;
    transition-delay: 0;
}

.sidebar-panel-body .sp-container,
.sidebar-panel-footer .sp-container,
.sidebar-flyout .sp-container {
    position: fixed !important;
}
.sp-palette-container {
    min-width: 176px;
}
.mfp-wrap{
    z-index: 1000000 !important;
}

.ui-front{
    z-index: 100000;
}
#combat_area tr.CTToken:before{
    content:  '???';
    font-size: 12px;
    position: absolute;
    left: 42px;
    width: calc(100% - 140px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    color: #4443;
}
#combat_area tr[data-name].CTToken:before{
    content: attr(data-name);
    color: #444d;
}
body.body-rpgcharacter-sheet #combat_area tr.CTToken:before,
body.avtt-spectator-sheet #combat_area tr.CTToken:before{
    width: calc(100% - 80px);
}

.hidden-sidebar-item{
    display: none !important;
}

.hidden-sidebar-item.temporary-visible{
    display: block !important;
}

.reveal-hidden-button.clicked{
    background: #F66;
}

.text-option{
    width:20px;
    height:20px;
    float:left;
}

#draw_menu .sp-replacer,
#text_menu .sp-replacer,
#vision_menu .sp-replacer{
    margin: 3px 1px;
    width: 98%;
}
#vision_menu svg.settings-gear {
    scale: 1.3;
    margin-left: 2px;
}
#vision_menu #bucket_menu {
    display: none;
    position: fixed;
    width: 155px;
    padding: 2px;
    border-radius: 5px;
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
#vision_menu #paint-bucket.button-enabled ~ #bucket_menu{
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}
#vision_menu #bucket_menu>div{
    display: inline-block;
    width: 35%;
}
#vision_menu #bucket_menu>div.menu-subtitle{
    display:inline-block;
    width: 65%;
}

#clearExplored Data{
    width:100%;
    padding:8px;
    margin:10px 0px 30px 0px;
}

div.ddbc-tab-options--layout-pill button{
    background-image: none;
    box-shadow: none;
    transition: none;
    border: 0px;
}
div.ddbc-tab-options--layout-pill>button{
    width: calc(100% - 4px);
}

#VTTWRAPPER ~ div.ddbc-tab-options--layout-pill>button,
#combat_tracker div.ddbc-tab-options--layout-pill>button{
    width: fit-content !important;
}

.chat-error-shake {
    position: relative;
    animation: shake .1s linear;
    animation-iteration-count: 1;
}
.sidebar__pane-content .audio-error{
    animation: audio-shake .1s linear;
    position:relative;
    animation-iteration-count: 5;
    background: #d44 !important;
}
.sidebar__pane-content .audio-error:hover:before {
    content: 'Failed to load track - double check link is valid';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -24px;
    width: 349px;
    color: #ddd;
    font-size: 16px;
    background: #950000;
    border-radius: 5px;
    opacity: 100%;
    border: 2px solid #000;
}
@keyframes shake {
    0% { left: -1px; }
    100% { right: -1px; }
}
@keyframes audio-shake {
    0% { left: -1px; }
    100% { right: -1px; }
}
.url-validator {
    position: absolute;
    top: -2px;
    left: -24px;
}

.url-validator.invalid {
    color: red;
}

.url-validator.unsure {
    color: rgb(255 82 0);
}

.url-validator.valid {
    color: green;
}

.url-validator.loading {
    color:blue;
    animation: spin 4s infinite linear;
    background: none;
    width: 24px;
    height: 24px;
}

.url-validator.loading.audio {
    animation: spin 4s infinite linear;
    background: none;
    position: absolute;
    font-size: 22px;
    width: 22px;
    height: 22px;
    left: 1px;
    top: 1px;
    transform-origin: center center;
}


.url-validator.loading:before{
    display:none;
}
#projector_toggle,
#projector_zoom_lock{
    display: none;
}
#projector_toggle.enabled,
#projector_zoom_lock.enabled{
    display: block;
}


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

.body-rpgcharacterbuilder #black_layer,
.body-rpgcharacterbuilder #VTTWRAPPER,
.body-rpgcharacterbuilder .site-bar,
.body-rpgcharacterbuilder #combat_button,
.body-rpgcharacterbuilder #VTTWRAPPER ~ .ddbc-tab-options--layout-pill{
    display: none !important;
}
body:not(.body-rpgcampaign) .site-bar{
    display:none !important;
}

[id^="streamer-"].hidden {
    display: none;
}
.aura-element-container-clip{
    position: absolute;
}
.aura-clip-container {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 8;
    mix-blend-mode: lighten;
}
.aura-clip-container:is(.devilsight, .truesight){
    z-index: 20 !important;
}
[data-darkness]{
    transform: rotate(calc(var(--token-rotation) + var(--token-heading)));
    z-index:16 !important;
    opacity: 1 !important;
}
[data-darkness] .token-image{
    transform: none !important;
}

[data-darkness] .aoe-style-darkness,
[data-darkness] .aoe-border-cone{
    opacity: 1 !important;
    background: #000;
    border:none;
} 

#tokens .underDarkness .token-image,
#tokens .underDarkness .base,
#tokens .underDarkness .hpvisualbar{
    opacity: 0 !important;
}

#tokens .grouprotate .token-image,
#tokens .grouprotate .base,
#tokens .grouprotate .hpvisualbar{
    opacity: 1 !important;
}

.body-rpgcharacter-sheet :is(#tokens, #token_map_items) .inPersonMini,
.avtt-spectator-sheet :is(#tokens, #token_map_items) .inPersonMini
{
    display: none !important;
}

.audio-token .audio-radius{
    position: absolute;
    border-radius: 50%;
    z-index: 19;
    pointer-events: none;
    display: none;
}
.audio-token.tokenselected .audio-radius{
    display: block;
}
#map_items{
    width:100%;
    height:100%;
    background: #000;
}
[data-notatoken]{
    border:none;
}
[data-notatoken]:not(.isAoe)>.token-image{
    width: var(--token-width) !important;
    height: var(--token-width) !important;
}



body.preventSelectDefinitelyNot .token.lockedToken,
body.preventSelectDefinitelyNot .token.lockedToken>.token-image,
body.preventSelectDefinitelyNot .token.lockedToken>.token-image,
body.preventSelectDefinitelyNot .token.lockedToken>.token-image>[data-img]{
    pointer-events: none !important;
}
body.preventSelectDefinitelyNot .token.declutterToken[style*='opacity: 0.5']{
    display: none !important;
}
.door-button #note{
    position: absolute;
    right: -4px;
    width: 10px;
    height: 10px;
    top: -5px;
    border-radius: 50%;
    border: 1px solid #000;
    overflow: hidden;
}
.door-button #note>img{
    background: #FF0;
    position:absolute;
    width:100%;
    height:100%;
    
}


.aura-element.islight,
.aura-element[id*='vision_']{
    z-index: 9;
    mix-blend-mode: lighten;
}

.aura-element-container-clip.vision:is(.devilsight, .truesight){
    z-index: 20 !important;
}
#map_items{
    mix-blend-mode: multiply;

}
#darkness_layer{
    z-index: 7;
    background: #fff;
    filter: brightness(var(--darkness-filter));

}
#light_container{
    mix-blend-mode:lighten;
    z-index: 15;
    opacity: 1;
}


#text_div{
    pointer-events:none;
}

#text_div svg text{
    pointer-events:all;
    cursor: move;
}

#scene_map_container{
    overflow: clip;
    transition: opacity 1.5s linear 0s;
    opacity:1;
    background:#000;
}
#scene_map_container.map-loading{
    opacity: 0;
    transition: none;
}

#peer_overlay {
    pointer-events: none;
}

#scene_map_container{
    transform: scale(var(--scene-scale));
    transform-origin: top left;
}

#scene_map_container.preview{
    pointer-events: none;
    width:50%;
}

.player_map_preview{
    width:45%;
    margin:0px 20px 20px 20px;
    cursor: pointer;
}
.player_map_preview.selected{
    box-shadow: 0px 0px 0px 3px #f00;
}



.aurafx-flicker{
    mix-blend-mode: plus-lighter;
    animation: aurafx-flicker 4s infinite alternate ease-in-out
}

[class*='MessageContainer-Flex'] .ct-creature-pane__full-image img{
    max-width:100%
}
.reduceMovement [data-animation],
.reduceMovement [data-animation]:before,
.reduceMovement [data-animation]:after,
.reduceMovement [data-animation] .islight,
.reduceMovement [data-animation] .islight:before,
.reduceMovement [data-animation] .islight:after{
    animation: none !important;
}

[data-clone-id],
[data-clone-id] * {
    pointer-events: none !important;
}
div.note[id^="ui-id"] {
    width: 100% !important;
    padding: 0px !important;
    max-height: calc(100% - 30px) !important;
    position: relative;
    overflow: scroll;
}
div.note[id^="ui-id"] { 
    height: 100% !important;
}
.tooltip-body-description-text.note-text img{
    max-width: 100%;
    height: auto;
}
.glc-game-log .note-text::-webkit-scrollbar{
    width: 3px;
}
.glc-game-log .note-text::-webkit-scrollbar-track {
    background: transparent;
}
.glc-game-log .note-text::-webkit-scrollbar-thumb{
    background-color: #232d3166;
    border-radius: 6px;
    border: none;
}
.glc-game-log .tooltip-body-description-text.note-text > * {
    max-width: calc(100% - 2px);
}

.glc-game-log .note-text{
    overflow:overlay;
}

div.note[id^="ui-id"] .mce-listbox button{
    padding: 0px;
}

div.note[id^="ui-id"] .mce-btn button {
    padding: 1px 4px;
}
.note .mce-container .mce-btn i.mce-ico.mce-i-upload:not(.mce-i-resize):before {
    font-family: "Material Icons", sans-serif !important;
    content: "\f09b";
    font-size: 20px;
}
body .mce-abs-layout-item,
.mce-abs-end{
    position: absolute !important;
}
.ui-dialog{
    padding: 0px !important;
}
.ui-dialog .ui-dialog-titlebar .ui-dialog-title {
    line-height: 18px;
}
.ui-dialog .ui-dialog-titlebar{
    height: 32px;
}
.ui-widget.ui-widget-content {
    max-height: calc(100vh - 20px);
    overflow: hidden;
}

.scenes-panel-add-buttons-wrapper {
    display: flex;
    flex-direction: row;
    position: relative;
    padding-right: 6px;
    padding-left: 4px;
    justify-content: space-between;
    width: 100%;
}

.folder.ui-droppable-hover {
    border: 2px solid black;
    background-color: white;
}
.reorder-button {
    background-color: #f2f6f8;
}
.reorder-button.active {
    background-color: #fff;
}


#journal-panel .reorder-button{
    display: inline;
}
#ddb-source-journal-import{
    display:inline;
    float:right;
    width:175px;
}
.body-rpgcharacter-sheet #VTT.paused *,
.avtt-spectator-sheet #VTT.paused *{
    pointer-events: none !important;
}

#pause_players.paused #player-pause-svg,
#pause_players #player-play-svg{
    display: none;
}
#pause_players #player-pause-svg,
#pause_players.paused #player-play-svg{
    display: block;
}

#pause_players svg{
    padding:0;
}

.token-row-drag-handle {
    display: block;
    width: 30px;
    height: 30px;
    padding: 3px;
    border-top-right-radius: 3px;
    border-bottom: 1px solid #d8e1e8;
    background-color: #f2f6f8;
    border-left: 1px solid #d8e1e8;
    margin: -4px -4px;
    cursor: move;
    min-width: 30px;

    position: relative;
}

#scenes-panel .sidebar-list-item-row.scene-item.ui-draggable,
.sidebar-list-item-row.ui-draggable {
    cursor: move;
}

.sidebar-list-item-row.ui-draggable-dragging {
    z-index: 100000;
}


.player-card.peerConnected .player-card-content::before,
.sidebar-list-item-row.player-row.peerConnected::before {
    content: "";
    height: 16px;
    width: 16px;
    border-radius: 8px;
    background: var(--player-border-color, gray);;
    display: block;
    position: absolute;
    top: 1px;
    left: 1px;
    border: 1px solid #f2f2f2; /* white border to help it stand out against dark backgrounds */
    box-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; /* black shadow border to help it stand out against light backgrounds */
}
.player-card.peerConnected .player-card-content:before {
    top: unset;
    left: 12px;
}
.sidebar-panel-footer .token-config-aura-wrapper h3 ~ .token-image-modal-footer-select-wrapper .token-image-modal-footer-title{
    font-size:9px;
    min-width:50px;
    margin-top:0px
    
}
.sidebar-panel-footer .token-config-aura-wrapper h3{
    font-size:12px;
    min-width:65px;
}
.sidebar-flyout .token-image-modal-footer-select-wrapper input.styled-number-input {
    position:absolute;
    right: 25px;
    width: 50px;
}
.peerCursorPosition {
    height: 16px;
    width: 16px;
    position: absolute;
    background: rgb(182, 6, 14); /* default DDB color */
    z-index: 19; /* fog is at z-index 20. Let's keep it below that so we don't show the DM messing around in the dark */
    border-radius: 8px;
    opacity: 0.7;
    border: 1px solid #f2f2f2; /* white border to help it stand out against dark backgrounds */
    box-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; /* black shadow border to help it stand out against light backgrounds */
}


.styled-number-input,
#manual_grid_data input {
    height: 15px;
    font-size: 13px;
    font-weight: bold;
    font-family: Roboto,Open Sans,Helvetica,sans-serif;
    text-decoration: underline;
    background: none;
    border-width: 0;
    text-align: right;
    width: 30px;
    border-radius: 2px;
}

.styled-number-input:focus,
#manual_grid_data input:focus {
    text-decoration: none;
    border-width: 1px;
}

#manual_grid_data input,
input[name='darkness_filter_number'],
input[name='gridStrokeNumberInput']{
     text-decoration: none;
     font-weight:normal;
     border: 1px solid #ddd;
}
input[name='upsq'] {
    padding-right: 17px;
}

.ct-decorate-pane__shop .ddbc-collapsible--opened .ddbc-collapsible__header,
.ct-container-manager .ddbc-collapsible--opened > .ddbc-collapsible__header,
.ct-equipment-manage-pane .ddbc-collapsible--opened:not(.ddbc-collapsible--minimal) > .ddbc-collapsible__header {
    top: 0px;
    z-index: 9;
}
.ct-decorate-pane__current-selections {
    position: relative;
}

/*Start note ddb styling*/
button.journal-view-button.journal-button {
    top: 5px !important;
    right: 27px;
    padding: 0px;
}
button.journal-view-button.journal-button img {
    height: 14px;
    opacity: 0.6;
}
:root .note-text{
    --theme-page-fg-color: #242527;
}
/* END - Default text color */
* .note-text{
    font-family: Roboto, Helvetica, sans-serif;
}

.note-text .Basic-Text-Frame {
    clear: both;
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .note-text .Basic-Text-Frame {
        -webkit-column-count:2;
        column-count: 2
    }
}

.note-text .Basic-Text-Frame-2 {
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .note-text .Basic-Text-Frame-2 {
        float:right;
        margin: 30px 0 15px 20px;
        width: 410px
    }
}

.note-text .Basic-Text-Frame-2 .compendium-image-center {
    margin-bottom: 20px;
    display: block
}

.note-text .Basic-Text-Frame-3 {
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .note-text .Basic-Text-Frame-3 {
        float:left;
        margin: 30px 20px 15px 0;
        width: 410px
    }
}

.note-text .Basic-Text-Frame-3 .compendium-image-center {
    margin-bottom: 20px;
    display: block
}

.note-text .Basic-Text-Frame,
.note-text .Basic-Text-Frame-2,
.note-text .Basic-Text-Frame-3 {
    position: relative;
    box-shadow: 0 0 5px #979AA4
}

.note-text .Basic-Text-Frame::before,
.note-text .Basic-Text-Frame::after,
.note-text .Basic-Text-Frame-2::before,
.note-text .Basic-Text-Frame-2::after,
.note-text .Basic-Text-Frame-3::before,
.note-text .Basic-Text-Frame-3::after {
    content: '';
    background-image: url("../images/MMStatBar_lrg.jpg");
    background-size: 100% 100%;
    background-position: center;
    height: 4px;
    display: inline-block;
    position: absolute
}

.note-text .Basic-Text-Frame::before,
.note-text .Basic-Text-Frame-2::before,
.note-text .Basic-Text-Frame-3::before {
    left: -3px;
    top: -3px;
    right: -3px
}

.note-text .Basic-Text-Frame::after,
.note-text .Basic-Text-Frame-2::after,
.note-text .Basic-Text-Frame-3::after {
    left: -3px;
    bottom: -3px;
    right: -3px
}

.note-text .Stat-Block-Styles_Stat-Block-Title {
    font-size: 18px!important;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1.4!important;
    margin-bottom: 0!important;
    display: inline;
    margin-right: 8px
}

.note-text .Stat-Block-Styles_Stat-Block-Metadata {
    font-style: italic;
    font-size: 14px!important;
    line-height: 1.4!important;
    margin-bottom: 8px!important
}

.note-text .Stat-Block-Styles_Stat-Block-Metadata::after {
    content: "";
    display: block;
    border-bottom: 2px solid #bc0f0f;
    padding-top: 5px
}

.note-text .Stat-Block-Styles_Stat-Block-Bar-Object-Space,
.note-text .Stat-Block-Styles_Stat-Block-Bar-Object-Space-Last {
    display: none
}

.note-text .Stat-Block-Styles_Stat-Block-Data,
.note-text .Stat-Block-Styles_Stat-Block-Data-Last,
.note-text .Stat-Block-Styles_Stat-Block-Body,
.note-text .Stat-Block-Styles_Stat-Block-Hanging,
.note-text .Stat-Block-Styles_Stat-Block-Hanging-Last,
.note-text .Stat-Block-Styles_Stat-Block-Body-Last--apply-before-heading- {
    font-size: 14px!important;
    line-height: 1.4!important;
    margin-bottom: 10px!important
}

.note-text .Stat-Block-Styles_Stat-Block-Heading,
.note-text .Stat-Block-Styles_Stat-Block-Heading--after-last-bar- {
    font-size: 16px!important;
    font-weight: bold;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif
}

.note-text .Stat-Block-Styles_Stat-Block-Heading::after,
.note-text .Stat-Block-Styles_Stat-Block-Heading--after-last-bar-::after {
    content: "";
    display: block;
    border-bottom: 1px solid #bc0f0f;
    padding-top: 2px
}

.note-text .Stat-Block-Styles_Stat-Block-Data-Last {
    border-bottom: 2px solid #bc0f0f;
    padding-bottom: 10px
}

.note-text .stat-block-ability-scores {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 2px solid #bc0f0f;
    border-bottom: 2px solid #bc0f0f;
    margin: 10px 0
}
[class*='MessageContainer-Flex'] div[role='listitem'] p,
[class*='MessageContainer-Flex'] div[role='listitem'] span {
    color: rgb(92, 112, 128);
}
[class*='MessageContainer-Flex'] div[role='listitem'] p,
[class*='MessageContainer-Flex'] div[role='listitem'] span{
    margin:0px 0px 0px 2px;
}
[class*='MessageContainer-Flex'] div[role='listitem']
{ 
    display:flex;
}
.note-text .stat-block-ability-scores-stat {
    width: 33.33333%;
    padding: 10px 5px;
    text-align: center
}


.note-text .text--quote-box {
    display: block !important;
    background-color: var(--compendium-quote-box-color, #FAF8EC) !important; /*Fallback: if the variable isn't declared, it'll default to pale yellow*/
    padding: 20px 25px 15px 25px !important;
    position: relative !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    border-radius: 0 !important;
    border-left: 1px solid !important;
    border-right: 1px solid !important;
    border-color: var(--compendium-quote-box-border, #620000) !important; /*Fallback: if the variable isn't declared, it'll default to dark red*/
    border-top: 0;
    border-bottom: 0;
    color: var(--theme-page-fg-color, #242527) !important;
    margin: 40px 20px !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
}
.note-text .text--quote-box::before {
    top: -4px !important;
}
.note-text .text--quote-box::before, 
.note-text .text--quote-box::after {
    content: '';
    border-radius: 50%;
    background-position: left !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 8px !important;
    width: 8px !important;
    left: -4px !important;
    position: absolute !important;
    background-color: var(--compendium-quote-box-corner, #620000);
}
 .note-text .text--quote-box::after {
    bottom: -4px !important;
}
 .note-text .text--quote-box p:first-of-type::before {
    top: -4px !important;
}
 .note-text .text--quote-box p:first-of-type::before,  
 .note-text .text--quote-box p:last-of-type::after {
    content: '';
    border-radius: 50%;
    background-position: right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 8px !important;
    width: 8px !important;
    right: -4px !important;
    position: absolute !important;
    background-color: var(--compendium-quote-box-corner, #620000);
}
 .note-text .text--quote-box p:last-of-type::after {
    bottom: -4px !important;
}
 .note-text .text--quote-box p:last-of-type {
    margin-bottom: 5px !important;
}
/* END - New quote box implementation */

/* START - New rules sidebar implementation */
.note-text .text--rules-sidebar {
    display: block !important;
    background-color: var(--compendium-rules-sidebar-color, #DAE4C1) !important; /*Fallback: if the variable isn't declared, it'll default to pale-green*/
    position: relative !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    margin: 30px 5px !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
    padding: 25px 28px 15px 30px !important;
    border-radius: 0 !important;
    border-top: 3px solid #231f20 !important;
    border-bottom: 3px solid #231f20 !important;
    border-left: 1.5px solid  #b3b3b3 !important;
    border-right: 1.5px solid  #b3b3b3 !important;
    color: var(--theme-page-fg-color, #242527) !important;
    filter: drop-shadow(0px 5px 8px #ccc);
}

.note-text .text--rules-sidebar p:first-of-type {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 16px;
}

.note-text .text--rules-sidebar .action-tooltip, 
.note-text .text--rules-sidebar .condition-tooltip, 
.note-text .text--rules-sidebar .item-tooltip, 
.note-text .text--rules-sidebar .rule-tooltip, 
.note-text .text--rules-sidebar .sense-tooltip, 
.note-text .text--rules-sidebar .skill-tooltip,
.note-text .text--rules-sidebar .weapon-properties-tooltip,
.note-text .text--rules-sidebar .action-tooltip {
    color: #129b54 !important;
}

.note-text .text--rules-sidebar::before {
    top: -13px !important;
    right: 0.1px !important;
    left: 0.1px !important;
}

.note-text .text--rules-sidebar::before {
    content: '';
    background-image: url("https://media.dndbeyond.com/compendium-images/components/--right-rules.svg"),url("https://media.dndbeyond.com/compendium-images/components/--left-rules.svg") !important;
    background-position: left, right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 11px !important;
    position: absolute !important;
    z-index: -1;
}

.note-text .text--rules-sidebar::after {
    bottom: -13px !important;
    right: -0.1px !important;
    left: 0.1px !important;
}
.note-text .text--rules-sidebar::after {
    content: '';
    background-image: url("https://media.dndbeyond.com/compendium-images/components/--right-rules.svg"),url("https://media.dndbeyond.com/compendium-images/components/--left-rules.svg") !important;
    background-position: left, right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 11px !important;
    position: absolute !important;
    z-index: -1;
    transform: scaleY(-1);
}
/* END - New rules sidebar implementation */

/* START - CSS header variables */
.note-text h1::after {
    background-color: var(--h1-underline, var(--header-underline, #47D18C));
}
.note-text h2::after {
    background-color: var(--h2-underline, var(--header-underline, #47D18C));
}
.note-text h3::after {
    background-color: var(--h3-underline, var(--header-underline, #47D18C));
}
/* END -  CSS header variables */

/* START - Underlines compendium links */
.note-text a:not(.ddb-lightbox-outer, h3 > a):hover,
.note-text a:not(.ddb-lightbox-outer, h3 > a):focus {
    text-decoration: underline;
}
/* END - Underlines Compendium links */


/** TEMP new .text--quote-box type for compendium content - needs to be added to compiled **/

.note-text .text--quote-box.compendium-indented-callout-.text--quote-box {
    background: transparent !important;
    font-size: 16px !important;
    border-left: 4px solid #e0dcdc !important;
    border-right: none !important;
    padding: 10px 20px !important;
    margin: 30px 0 !important;
}

.note-text .text--quote-box.compendium-indented-callout-.text--quote-box::before {
    content: none !important;
}

.note-text .text--quote-box.compendium-indented-callout-.text--quote-box::after {
    content: none !important;
}  

/** END TEMP new .text--quote-box type **/


.note-text h6 {
    font-size: 14px !important;
    font-weight: bold !important;
}


.note-text h1 {
    font-size: 32px!important;
    font-weight: 400!important
}

.note-text h2 {
    font-size: 26px!important;
    font-weight: 400!important;
    clear: both
}

.note-text h3 {
    font-size: 22px!important;
    font-weight: 400!important;
    clear: both
}

.note-text h4 {
    font-size: 18px!important;
    font-weight: 700!important
}

.note-text h5 {
    font-size: 16px!important;
    font-weight: 700!important
}


.note-text .rules-text a {
    color: #129b54!important;
    transition: .3s
}

.note-text .rules-text p:first-child {
    font-size: 16px
}


.note-text .stat-block-background {
    background-repeat: no-repeat;
    -webkit-box-shadow: 0 5px 8px 0 #aaa;
    -moz-box-shadow: 0 5px 8px 0 #aaa;
    box-shadow: 0 5px 8px 0 #aaa;
    background-position: top!important;
    background-image: url(https://media.dndbeyond.com/encounter-builder/static/media/stat-block-top-texture.70eb7c244ee206f35cc0.png),url(https://media.dndbeyond.com/encounter-builder/static/media/paper-texture.88243187e307464c5837.png) !important;
    background-size: 100%, cover !important;
}

.note-text .stat-block-background:after,
.note-text .stat-block-background:before {
    content: "";
    display: block;
    background: url(https://www.dndbeyond.com/Content/Skins/Waterdeep/images/mon-summary/stat-bar-book.png) 50%;
    background-size: 100% 100%;
    height: 6px;
    position: absolute;
    left: -3px;
    right: -3px;
}


.note-text .block-torn-paper,
.note-text .epigraph,
.note-text .epigraph--with-author {
    overflow: auto;
    background: none;
    color: var(--theme-quote-fg-color,#242527);
    margin: 40px 0;
    line-height: 1.6;
    font-size: 14px;
    border: solid transparent;
    border-width: 20px 10px;
    border-image-source: var(--theme-quote-border,url(https://media.dndbeyond.com/ddb-compendium-client/5f1f1d66d16be68cf09d6ca172f8df92.png));
    border-image-repeat: repeat;
    border-image-slice: 20 10 20 10 fill;
    padding: 10px;
    position: relative
}

.note-text .epigraph--with-author p:last-child {
    font-style: italic;
    text-align: right
}

.note-text .rules-text {
    overflow: auto;
    display: block;
    margin: 30px 0;
    line-height: 1.6;
    font-size: 14px;
    color: var(--theme-rules-text-fg-color,#242527);
    border-color: transparent;
    border-style: solid;
    border-width: 15px 20px;
    border-image-repeat: repeat;
    border-image-slice: 21 30 21 30 fill;
    background-color: transparent;
    padding: 20px 10px 10px;
    position: relative;
    border-image-source: var(--theme-rules-text-border,url(https://media.dndbeyond.com/ddb-compendium-client/463d4668370589a1a73886611645df7e.png));
    -webkit-filter: drop-shadow(0 5px 8px #ccc);
    filter: drop-shadow(0 5px 8px #ccc)
}

.note-text .rules-text p:first-child {
    text-transform: uppercase;
    font-weight: 700
}

.note-text .read-aloud-text {
    overflow: auto;
    display: block;
    margin: 30px 0;
    line-height: 1.6;
    font-size: 14px;
    color: var(--theme-read-aloud-fg-color,#242527);
    border: 8px solid transparent;
    border-image-repeat: repeat;
    border-image-slice: 8 8 8 8 fill;
    background-color: transparent;
    padding: 20px 20px 10px!important;
    position: relative;
    border-image-source: var(--theme-read-aloud-border,url(https://media.dndbeyond.com/ddb-compendium-client/146117d0758df55ed5ff299b916e9bd1.png))
}



:root .custom-stat-block{
    --theme-page-fg-color: #242527;
}
/* END - Default text color */
* .custom-stat-block{
    font-family: Roboto, Helvetica, sans-serif;
}

.custom-stat-block .Basic-Text-Frame {
    clear: both;
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .custom-stat-block .Basic-Text-Frame {
        -webkit-column-count:2;
        column-count: 2
    }
}
.note-text .one-column-stat,
.custom-stat-block .one-column-stat {
    -webkit-column-count:1;
    column-count: 1;
}
.custom-stat-block .Basic-Text-Frame-2 {
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .custom-stat-block .Basic-Text-Frame-2 {
        float:right;
        margin: 30px 0 15px 20px;
        width: 410px
    }
}

.custom-stat-block .Basic-Text-Frame-2 .compendium-image-center {
    margin-bottom: 20px;
    display: block
}

.custom-stat-block .Basic-Text-Frame-3 {
    border: 1px solid #d4d0ce;
    background: white;
    padding: 15px
}

@media(min-width: 768px) {
    .custom-stat-block .Basic-Text-Frame-3 {
        float:left;
        margin: 30px 20px 15px 0;
        width: 410px
    }
}

.custom-stat-block .Basic-Text-Frame-3 .compendium-image-center {
    margin-bottom: 20px;
    display: block
}

.custom-stat-block .Basic-Text-Frame,
.custom-stat-block .Basic-Text-Frame-2,
.custom-stat-block .Basic-Text-Frame-3 {
    position: relative;
    box-shadow: 0 0 5px #979AA4
}

.custom-stat-block .Basic-Text-Frame::before,
.custom-stat-block .Basic-Text-Frame::after,
.custom-stat-block .Basic-Text-Frame-2::before,
.custom-stat-block .Basic-Text-Frame-2::after,
.custom-stat-block .Basic-Text-Frame-3::before,
.custom-stat-block .Basic-Text-Frame-3::after {
    content: '';
    background-image: url("../images/MMStatBar_lrg.jpg");
    background-size: 100% 100%;
    background-position: center;
    height: 4px;
    display: inline-block;
    position: absolute
}

.custom-stat-block .Basic-Text-Frame::before,
.custom-stat-block .Basic-Text-Frame-2::before,
.custom-stat-block .Basic-Text-Frame-3::before {
    left: -3px;
    top: -3px;
    right: -3px
}

.custom-stat-block .Basic-Text-Frame::after,
.custom-stat-block .Basic-Text-Frame-2::after,
.custom-stat-block .Basic-Text-Frame-3::after {
    left: -3px;
    bottom: -3px;
    right: -3px
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Title {
    font-size: 18px!important;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1.4!important;
    margin-bottom: 0!important;
    display: inline;
    margin-right: 8px
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Metadata {
    font-style: italic;
    font-size: 14px!important;
    line-height: 1.4!important;
    margin-bottom: 8px!important
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Metadata::after {
    content: "";
    display: block;
    border-bottom: 2px solid #bc0f0f;
    padding-top: 5px
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Bar-Object-Space,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Bar-Object-Space-Last {
    display: none
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Data,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Data-Last,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Body,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Hanging,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Hanging-Last,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Body-Last--apply-before-heading- {
    font-size: 14px!important;
    line-height: 1.4!important;
    margin-bottom: 10px!important
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Heading,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Heading--after-last-bar- {
    font-size: 16px!important;
    font-weight: bold;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Heading::after,
.custom-stat-block .Stat-Block-Styles_Stat-Block-Heading--after-last-bar-::after {
    content: "";
    display: block;
    border-bottom: 1px solid #bc0f0f;
    padding-top: 2px
}

.custom-stat-block .Stat-Block-Styles_Stat-Block-Data-Last {
    border-bottom: 2px solid #bc0f0f;
    padding-bottom: 10px
}

.custom-stat-block .stat-block-ability-scores {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 2px solid #bc0f0f;
    border-bottom: 2px solid #bc0f0f;
    margin: 10px 0
}

.custom-stat-block .stat-block-ability-scores-stat {
    width: 33.33333%;
    padding: 10px 5px;
    text-align: center
}
/* START - New quote box implementation */
[class*='MessageContainer'] .tooltip-body{
    padding: 0px;
    min-width: 240px;
    overflow-wrap: break-word;
    width: 100%;
    scrollbar-width: thin;
    & .tooltip-body-description-text{
        scrollbar-width: thin;
    }
}
[class*="MessageContainer"] .tooltip-header .tooltip-header-text {
    max-width: calc(100% - 100px);
    text-wrap: nowrap; 
    & *{
      overflow: hidden;  
      text-overflow: ellipsis;
    }
    & .tooltip-header-title{       
        font-size:18px;
        display:block;
    }
    & .badge{
        display:none;
    }
}
[class*='GameLogEntries'] [class*='Message-Collapsed-Other-Flex']:has(.tooltip-body){
    padding:0;
}

.body-rpgcharacter-sheet [class*='MessageContainer'] .tooltip-body{
    --theme-contrast: #b43c35;
    & tr td{
        background: #fff;
    }
    & tr:nth-child(odd) td{
     background: color-mix(in srgb, rgb(245, 248, 250), #000 10%);
    }  
}

.tooltip-body .detail-content {
    width: 100% ;
}

.custom-stat-block .text--quote-box {
    display: block !important;
    background-color: var(--compendium-quote-box-color, #FAF8EC) !important; /*Fallback: if the variable isn't declared, it'll default to pale yellow*/
    padding: 20px 25px 15px 25px !important;
    position: relative !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    border-radius: 0 !important;
    border-left: 1px solid !important;
    border-right: 1px solid !important;
    border-color: var(--compendium-quote-box-border, #620000) !important; /*Fallback: if the variable isn't declared, it'll default to dark red*/
    border-top: 0;
    border-bottom: 0;
    color: var(--theme-page-fg-color, #242527) !important;
    margin: 40px 20px !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
}
.custom-stat-block .text--quote-box::before {
    top: -4px !important;
}
.custom-stat-block .text--quote-box::before, 
.custom-stat-block .text--quote-box::after {
    content: '';
    border-radius: 50%;
    background-position: left !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 8px !important;
    width: 8px !important;
    left: -4px !important;
    position: absolute !important;
    background-color: var(--compendium-quote-box-corner, #620000);
}
 .custom-stat-block .text--quote-box::after {
    bottom: -4px !important;
}
 .custom-stat-block .text--quote-box p:first-of-type::before {
    top: -4px !important;
}
 .custom-stat-block .text--quote-box p:first-of-type::before,  
 .custom-stat-block .text--quote-box p:last-of-type::after {
    content: '';
    border-radius: 50%;
    background-position: right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 8px !important;
    width: 8px !important;
    right: -4px !important;
    position: absolute !important;
    background-color: var(--compendium-quote-box-corner, #620000);
}
 .custom-stat-block .text--quote-box p:last-of-type::after {
    bottom: -4px !important;
}
 .custom-stat-block .text--quote-box p:last-of-type {
    margin-bottom: 5px !important;
}
/* END - New quote box implementation */

/* START - New rules sidebar implementation */
.custom-stat-block .text--rules-sidebar {
    display: block !important;
    background-color: var(--compendium-rules-sidebar-color, #DAE4C1) !important; /*Fallback: if the variable isn't declared, it'll default to pale-green*/
    position: relative !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    margin: 30px 5px !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
    padding: 25px 28px 15px 30px !important;
    border-radius: 0 !important;
    border-top: 3px solid #231f20 !important;
    border-bottom: 3px solid #231f20 !important;
    border-left: 1.5px solid  #b3b3b3 !important;
    border-right: 1.5px solid  #b3b3b3 !important;
    color: var(--theme-page-fg-color, #242527) !important;
    filter: drop-shadow(0px 5px 8px #ccc);
}

.custom-stat-block .text--rules-sidebar p:first-of-type {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 16px;
}

.custom-stat-block .text--rules-sidebar .action-tooltip, 
.custom-stat-block .text--rules-sidebar .condition-tooltip, 
.custom-stat-block .text--rules-sidebar .item-tooltip, 
.custom-stat-block .text--rules-sidebar .rule-tooltip, 
.custom-stat-block .text--rules-sidebar .sense-tooltip, 
.custom-stat-block .text--rules-sidebar .skill-tooltip,
.custom-stat-block .text--rules-sidebar .weapon-properties-tooltip,
.custom-stat-block .text--rules-sidebar .action-tooltip {
    color: #129b54 !important;
}

.custom-stat-block .text--rules-sidebar::before {
    top: -13px !important;
    right: 0.1px !important;
    left: 0.1px !important;
}

.custom-stat-block .text--rules-sidebar::before {
    content: '';
    background-image: url("https://media.dndbeyond.com/compendium-images/components/--right-rules.svg"),url("https://media.dndbeyond.com/compendium-images/components/--left-rules.svg") !important;
    background-position: left, right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 11px !important;
    position: absolute !important;
    z-index: -1;
}

.custom-stat-block .text--rules-sidebar::after {
    bottom: -13px !important;
    right: -0.1px !important;
    left: 0.1px !important;
}
.custom-stat-block .text--rules-sidebar::after {
    content: '';
    background-image: url("https://media.dndbeyond.com/compendium-images/components/--right-rules.svg"),url("https://media.dndbeyond.com/compendium-images/components/--left-rules.svg") !important;
    background-position: left, right !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 11px !important;
    position: absolute !important;
    z-index: -1;
    transform: scaleY(-1);
}
/* END - New rules sidebar implementation */

/* START - CSS header variables */
.custom-stat-block h1::after {
    background-color: var(--h1-underline, var(--header-underline, #47D18C));
}
.custom-stat-block h2::after {
    background-color: var(--h2-underline, var(--header-underline, #47D18C));
}
.custom-stat-block h3::after {
    background-color: var(--h3-underline, var(--header-underline, #47D18C));
}
/* END -  CSS header variables */

/* START - Underlines compendium links */
.custom-stat-block a:not(.ddb-lightbox-outer, h3 > a):hover,
.custom-stat-block a:not(.ddb-lightbox-outer, h3 > a):focus {
    text-decoration: underline;
}
/* END - Underlines Compendium links */


/** TEMP new .text--quote-box type for compendium content - needs to be added to compiled **/

.custom-stat-block .text--quote-box.compendium-indented-callout-.text--quote-box {
    background: transparent !important;
    font-size: 16px !important;
    border-left: 4px solid #e0dcdc !important;
    border-right: none !important;
    padding: 10px 20px !important;
    margin: 30px 0 !important;
}

.custom-stat-block .text--quote-box.compendium-indented-callout-.text--quote-box::before {
    content: none !important;
}

.custom-stat-block .text--quote-box.compendium-indented-callout-.text--quote-box::after {
    content: none !important;
}  

/** END TEMP new .text--quote-box type **/


.custom-stat-block h6 {
    font-size: 14px !important;
    font-weight: bold !important;
}


.custom-stat-block h1 {
    font-size: 32px!important;
    font-weight: 400!important
}

.custom-stat-block h2 {
    font-size: 26px!important;
    font-weight: 400!important;
    clear: both
}

.custom-stat-block h3 {
    font-size: 22px!important;
    font-weight: 400!important;
    clear: both
}

.custom-stat-block h4 {
    font-size: 18px!important;
    font-weight: 700!important
}

.custom-stat-block h5 {
    font-size: 16px!important;
    font-weight: 700!important
}


.custom-stat-block .rules-text a {
    color: #129b54!important;
    transition: .3s
}

.custom-stat-block .rules-text p:first-child {
    font-size: 16px
}


.custom-stat-block .stat-block-background {
    background-repeat: no-repeat;
    -webkit-box-shadow: 0 5px 8px 0 #aaa;
    -moz-box-shadow: 0 5px 8px 0 #aaa;
    box-shadow: 0 5px 8px 0 #aaa;
    background-position: top!important;
    background-image: url(https://media.dndbeyond.com/encounter-builder/static/media/stat-block-top-texture.70eb7c244ee206f35cc0.png),url(https://media.dndbeyond.com/encounter-builder/static/media/paper-texture.88243187e307464c5837.png) !important;
    background-size: 100%, cover !important;
}

.custom-stat-block .stat-block-background:after,
.custom-stat-block .stat-block-background:before {
    content: "";
    display: block;
    background: url(https://www.dndbeyond.com/Content/Skins/Waterdeep/images/mon-summary/stat-bar-book.png) 50%;
    background-size: 100% 100%;
    height: 6px;
    position: absolute;
    left: -3px;
    right: -3px;
}


.custom-stat-block .block-torn-paper,
.custom-stat-block .epigraph,
.custom-stat-block .epigraph--with-author {
    overflow: auto;
    background: var(--theme-quote-bg-color,#fff);
    color: var(--theme-quote-fg-color,#242527);
    margin: 40px 0;
    line-height: 1.6;
    font-size: 14px;
    border: solid transparent;
    border-width: 20px 10px;
    border-image-source: var(--theme-quote-border,url(https://media.dndbeyond.com/ddb-compendium-client/5f1f1d66d16be68cf09d6ca172f8df92.png));
    border-image-repeat: repeat;
    border-image-slice: 20 10 20 10 fill;
    padding: 10px;
    position: relative
}

.custom-stat-block .epigraph--with-author p:last-child {
    font-style: italic;
    text-align: right
}

.custom-stat-block .rules-text {
    overflow: auto;
    display: block;
    margin: 30px 0;
    line-height: 1.6;
    font-size: 14px;
    color: var(--theme-rules-text-fg-color,#242527);
    border-color: transparent;
    border-style: solid;
    border-width: 15px 20px;
    border-image-repeat: repeat;
    border-image-slice: 21 30 21 30 fill;
    background-color: transparent;
    padding: 20px 10px 10px;
    position: relative;
    border-image-source: var(--theme-rules-text-border,url(https://media.dndbeyond.com/ddb-compendium-client/463d4668370589a1a73886611645df7e.png));
    -webkit-filter: drop-shadow(0 5px 8px #ccc);
    filter: drop-shadow(0 5px 8px #ccc)
}

.custom-stat-block .rules-text p:first-child {
    text-transform: uppercase;
    font-weight: 700
}

.custom-stat-block .read-aloud-text {
    overflow: auto;
    display: block;
    margin: 30px 0;
    line-height: 1.6;
    font-size: 14px;
    color: var(--theme-read-aloud-fg-color,#242527);
    border: 8px solid transparent;
    border-image-repeat: repeat;
    border-image-slice: 8 8 8 8 fill;
    background-color: transparent;
    padding: 20px 20px 10px!important;
    position: relative;
    border-image-source: var(--theme-read-aloud-border,url(https://media.dndbeyond.com/ddb-compendium-client/146117d0758df55ed5ff299b916e9bd1.png))
}
.injected-input {
    font-size: 14px; 
    min-width: 40px; 
    appearance: none; 
    border: 1px solid #d8e1e8; 
    border-radius: 3px;
}
.chatTimer {
    display: flex;
    flex-direction: column;
    align-items: center;
    position:relative;
    width: calc(100% - 40px);
    span.timerMessage {
        font-weight: bold;
        font-size: 16px;
        max-width: 80%;
    }
    span.timerBar {
        font-size: 20px;
    }
    .timerCloseButton{
        position:absolute;
        top: 5px;
        right: 5px;
    }
    .timerCancelButton,
    .timerPauseButton{
        color: rgb(211 211 211);
        text-shadow: 1px 1px 1px #000, 0px 0px 1px #000;
        font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
        font-size: 25px;
        text-overflow: clip;
    }
    .timerButtonContainer{
        display: flex;
        gap: 5px;
    }
    .timerCancelButton:hover,
    .timerPauseButton:hover{
        cursor: pointer;
        color: #F00;
    }
    .timerPauseButton:hover{
        color: #ff8f00;
    }
    .timerPauseButton.paused:hover{
        color: #23cb23;
    }
}

.custom-stat-block input.injected-input {
    margin-left: 5px;
}
/* end Note ddb styling*/
/* end Note ddb styling*/


.help-compatible-tool{
    height: fit-content;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    width: 60%;
    margin: auto;
    align-items: center;
    margin-bottom: 50px;
    text-align: center;
}

.compatible-tool-title{
    font-size: 25px;
    font-weight: bold;
}
.compatible-tool-icon{
    filter: drop-shadow(1px 1px 1px #000);
    display: block;
    height:120px;
}



/* start quick roll menu */
#qrm_dialog button{
    background-image: -webkit-linear-gradient(top, #fff, #e6e6e6);
    color: #3d3d3d;
    height: 22px;
    margin: 0 2px;
    border-radius: 7px;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
    padding: 2px 4px;
    transition: color 0.3s ease-in-out, background 0.3s ease-in-out, background-color 0.3s ease-in-out, background-image 0.1s ease-in-out;
    border: 1px solid lightgray;
    font-size: 12px;
    overflow: hidden;
}
.qrm_name_line{
    text-align: left;
    color: #444d;
    font-weight: 600;

}
button.resistanceButton.qrm_buttons_bar span {
    font-size: 16px;
    text-align:center;
}
#qrm_dialog button.resistanceButton{
    outline:none; 
    margin-right:20px;
}
#qrm_dialog button.resistanceButton.enabled {
    color:#00c400;
    box-shadow: inset 1px 1px 3px 0px #196a00, inset -1px -1px 3px 0px #82ff5b;
    transition: none;
}
#qrm-block-send-to-game-log {
    width: 22px;
    height: 22px;
    display:inline-flex;
    align-items: center;
    justify-content: center;
    position:relative;
}

[class*="glc-game-log"] span.save-fail{
    color: #A00;
}
[class*="glc-game-log"] span.save-success{
    color:#0A0;
}
[class*="glc-game-log"] table#qrm-gamelog{
    width: 100%;
    display: block;
    border-radius:5px;
    border:1px solid #ddd
}
[class*="glc-game-log"] table#qrm-gamelog tbody{
    width:100%;
    display:block;
}

[class*="glc-game-log"] table#qrm-gamelog tr{
    display:table;
    width:100%;
}
[class*="glc-game-log"] table#qrm-gamelog td:last-of-type {
    width: 100% !important;
}
.body-rpgcharacter-sheet [class*="glc-game-log"] table#qrm-gamelog tr.hideQrmRowFromPlayers .qrm_name_line,
.avtt-spectator-sheet [class*="glc-game-log"] table#qrm-gamelog tr.hideQrmRowFromPlayers .qrm_name_line {
    visibility: hidden;
}

.body-rpgcharacter-sheet [class*="glc-game-log"] table#qrm-gamelog tr.hideQrmRowFromPlayers .qrm_name_line::before,
.avtt-spectator-sheet [class*="glc-game-log"] table#qrm-gamelog tr.hideQrmRowFromPlayers .qrm_name_line::before {
    content: '???';
    visibility: visible;
}
[class*="glc-game-log"] table#qrm-gamelog :is(tr, td),  
[class*="glc-game-log"] table#qrm-gamelog{
    background:none;
    border: none;
    margin: 0px;
    padding: 0px;
    border-radius:5px;
}
[class*="glc-game-log"] table#qrm-gamelog td{
    max-width:210px;
    width:100%;
}
[class*="glc-game-log"] table#qrm-gamelog tr:nth-of-type(odd){
    backdrop-filter:brightness(0.96);
    border-radius:5px;
}


#qrm-block-send-to-game-log span{
    font-size: 20px;
}
.menu_table{
    overflow: visible;
    overflow-x: scroll;
    height: calc(100% - 55px);
    background: #f9f9f9 url(https://www.dndbeyond.com/content/1-0-2416-0/skins/waterdeep/images/background_texture.png) repeat !important;
}
.menu_roll_input{
    margin: 1px;
    border-radius: 3px;
    border-color: #ddd;
    height:22px;
    font-size: 12px !important;
    box-shadow: 1px 1px 1px 0px #00000047;
    text-transform: uppercase;
}
.custom-stat-block{
    width: 100%;
    height: calc(100% - 25px);
    background: #fff;
}

.square-aura-element:is([id*='aura_'], .islight):not([data-animation]) {
    background-image: none !important;
    --thickness2: calc(var(--radius2) - var(--radius1));
    box-sizing: border-box;
    padding: var(--thickness2);
    background-color: color-mix(in srgb, rgba(var(--color1)) calc(100% * var(--opacity1)), transparent 0%);
    background-clip: content-box;
    box-shadow: inset 0 0 0 var(--thickness2) color-mix(in srgb, rgba(var(--color2)) calc(100% * var(--opacity2)), transparent 0%);;
    border-radius: 0;
}

.vision>.square-aura-element:not([data-animation]) {
    border-radius: 0;
    background-image: none !important;
    background-color: var(--vision-color);
}
.square-aura-element:not([data-animation]){
    rotate: none !important;
}
.aura-element{
    rotate: var(--rotation);
}
/*light/aura animations*/
[data-animation='static-blur-fx'] .islight,
.aura-element[data-animation='static-blur-fx']{
    --light1-blur-size: calc(var(--radius1) * 0.8);
    --light2-blur-size: calc(var(--radius2) * 0.8);
    --transparency-blur-size: calc(var(--light2-blur-size) * 1.2);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
}

[data-animation='static-blur-fx'] :is(.darkvision, .devilsight, .truesight),
[data-animation='flicker-fx'] :is(.darkvision, .devilsight, .truesight){
    background-image: radial-gradient(var(--vision-color) calc(var(--vision-radius) * 0.9), #00000000 var(--vision-radius)) !important;
}
[data-custom-animation] .islight,
.aura-element[data-custom-animation],
[data-custom-animation].darkvision-animation :is(.darkvision, .devilsight, .truesight){
 -webkit-mask-image: var(--custom-mask-image);
 -webkit-mask-size: contain;
}
[data-animation='aurafx-rotate'] .islight,
.aura-element[data-animation='aurafx-rotate'][id*='aura_'],
[data-animation='aurafx-rotate'].darkvision-animation :is(.darkvision, .devilsight, .truesight) {
    animation: aurafx-rotate var(--custom-rotate-rpm, 40s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
}

[data-animation='flicker-fx'] .islight,
.aura-element[data-animation='flicker-fx']{
    --light1-blur-size: calc(var(--radius1) * var(--light1-blur-size-animated));
    --light2-blur-size: calc(var(--radius2) * var(--light2-blur-size-animated));
    --transparency-blur-size: calc(var(--light2-blur-size) * var(--transparency-blur-size-animated));
    animation: aurafx-flicker 3s infinite alternate linear(1.22 -19.85%, 0.93 -0.74%, 0.46 13.24%, 0.71 34.56%, 0.46 58.82%, 0.74 70.59%, 1 100%);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
}
.reduceMovement [data-animation='flicker-fx'] .islight,
.reduceMovement .aura-element[data-animation='flicker-fx']{
    --light1-blur-size: calc(var(--radius1) * 0.8);
    --light2-blur-size: calc(var(--radius2) * 0.8);
    --transparency-blur-size: calc(var(--light2-blur-size) * 1.2);
}

[data-animation='rays-fx'] .islight:after,
.aura-element[data-animation='rays-fx'][id*='aura_']:after{
    animation: aurafx-rotate var(--custom-rotate-rpm, 100s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    content:'';
    width:100%;
    height:100%;
    position:absolute;
    border-radius:50%;
    background-image: repeating-conic-gradient(from 0deg, transparent 0deg 3deg, #0006 5deg 7deg, transparent 9deg)
}
[data-animation='rays-fx'] .islight:after{
    background-image: repeating-conic-gradient(from 0deg, transparent 0deg 3deg, #000 5deg 7deg, transparent 9deg)
}
.aura-element[data-animation='rays-fx'][id*='aura_']{
    animation: aurafx-rotate var(--custom-rotate-rpm, 100s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    -webkit-mask-image: repeating-conic-gradient(from 0deg, #fff 0deg 3deg, transparent 5deg 7deg, #fff 9deg);
}
[data-animation='wild-fx'] .islight,
.aura-element[data-animation='wild-fx'][id*='aura_'] {
    animation: aurafx-wild 20s infinite linear reverse;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0))) skew(calc(1deg * var(--animation-skew-x)), calc(1deg * var(--animation-skew-y)));
}
[data-animation='wild-fx'] .islight:after,
.aura-element[data-animation='wild-fx'][id*='aura_']:after {
    animation: aurafx-wild-hue 10s infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0))) skew(calc(1deg * var(--animation-skew-x)), calc(1deg * var(--animation-skew-y)));
    filter: hue-rotate(calc(1deg * var(--animation-rotation, 0)));
    content:'';
    width:100%;
    height:100%;
    position:absolute;
    border-radius:50%;
    -webkit-mask-image: radial-gradient(45% 45% at center,#ffffff00 70%, #ffffff 100%);
    background-image: radial-gradient(45% 45% at center,#ffffff 50%,#b7b7b75c 90%,#2f0000ba 100%,#fff0 105%, #2f0000 110%), linear-gradient(#ff0000, #ff8f00, #ffda00, #0effe8, #3b59ff, #300057);

}

[data-animation='force-fx'] .islight:after,
.aura-element[data-animation='force-fx'][id*='aura_']:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    border-radius: 50%;
    mix-blend-mode: multiply;
    filter:blur(1px);
    background-image: radial-gradient(circle at 100px 100px, #ffffff00, #0000003d);
    -webkit-mask-image: radial-gradient(45% 45% at center,#ffffff 108%, #ffffff00 100%);
}
[data-animation='force-fx'] .islight:before,
.aura-element[data-animation='force-fx'][id*='aura_']:before {
  animation: aurafx-force 1s infinite linear alternate;
  transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
  content: "";
  position: absolute;
  background: radial-gradient(circle at 50% 120%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%), radial-gradient(ellipse at 35% 30%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8) 5%, rgba(255, 255, 255, 0) 25%);
  border-radius: 50%;
  bottom: 2.5%;
  left: 5%;
  opacity: 0.6;
  height: 100%;
  width: 90%;
  z-index: 2;
}


[data-animation='fairy-fx'] .islight,
.aura-element[data-animation='fairy-fx'][id*='aura_'] {
    animation: aurafx-fairy 150s infinite linear;
    -webkit-mask-size: var(--animation-width);
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
}

[data-animation='fairy-fx'] .islight:before,
.aura-element[data-animation='fairy-fx'][id*='aura_']:before {
    animation: aurafx-fairy2 50s infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #fff;
    -webkit-mask-size: var(--animation-width);
    border-radius: 50%;
    translate: 5px;
}

[data-animation='magic-circle-fx'] .islight,
.aura-element[data-animation='magic-circle-fx'][id*='aura_'] {
    animation: aurafx-rotate var(--custom-rotate-rpm, 80s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
   -webkit-mask-size: contain;
}

[data-animation='magic-circle-2-fx'] .islight,
.aura-element[data-animation='magic-circle-2-fx'][id*='aura_'] {
    animation: aurafx-rotate var(--custom-rotate-rpm, 80s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    -webkit-mask-size: contain;
}

[data-animation='spore-fx'] .islight,
.aura-element[data-animation='spore-fx'][id*='aura_'] {
    animation: aurafx-rotate var(--custom-rotate-rpm, 180s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
   -webkit-mask-size: contain;
   filter:blur(5px);
}

[data-animation='lightning-fx'] .islight,
.aura-element[data-animation='lightning-fx'][id*='aura_'] {
    -webkit-mask-size: contain;
    -webkit-mask-image: var(--mask-1);
    --light1-blur-size: var(--radius1);
    --light2-blur-size: var(--radius2);
    --transparency-blur-size: var(--light2-blur-size);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
}

[data-animation='hurricane-fx'] .islight,
.aura-element[data-animation='hurricane-fx'][id*='aura_'] {
    animation: aurafx-rotate var(--custom-rotate-rpm, 30s) infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    -webkit-mask-size: contain;
    --light1-blur-size: var(--radius1);
    --light2-blur-size: var(--radius2);
    --transparency-blur-size: var(--light2-blur-size);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
}

[data-animation='hurricane-fx'] .islight:before,
.aura-element[data-animation='hurricane-fx'][id*='aura_']:before
{
    animation: lightning 5s infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, var(--opacity));
    -webkit-mask-size: contain;
    mix-blend-mode: overlay;
}

[data-animation='snow-fx'] .islight,
.aura-element[data-animation='snow-fx'][id*='aura_']{
    border-radius:50%;
    overflow:hidden;
    background: #0000 !important;
}

[data-animation='snow-fx'] .islight:before,
.aura-element[data-animation='snow-fx'][id*='aura_']:before,
[data-animation='snow-fx'] .islight:after,
.aura-element[data-animation='snow-fx'][id*='aura_']:after
{
    animation: snow 5s infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    --light1-blur-size: var(--radius1);
    --light2-blur-size: var(--radius2);
    --transparency-blur-size: var(--light2-blur-size);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
    -webkit-mask-size: var(--animation-width);
    overflow:hidden;
    border-radius:50%;
    --starting-deg: 0;
}

[data-animation='snow-fx'] .islight:before,
.aura-element[data-animation='snow-fx'][id*='aura_']:before
{
    animation: snow 5s infinite 2.5s linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    --starting-deg: 230;
    --opacity:0;
}


[data-animation='bubble-fx'] .islight,
.aura-element[data-animation='bubble-fx'][id*='aura_']{
    border-radius:50%;
    overflow:hidden;
    background: #0000 !important;
    filter:blur(2px);
}
[data-animation='bubble-fx'] .islight:before,
.aura-element[data-animation='bubble-fx'][id*='aura_']:before,
[data-animation='bubble-fx'] .islight:after,
.aura-element[data-animation='bubble-fx'][id*='aura_']:after
{
    animation: bubble 6s infinite linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    --opacity: 0;
    --light1-blur-size: var(--radius1);
    --light2-blur-size: var(--radius2);
    --transparency-blur-size: var(--light2-blur-size);
    background-image: radial-gradient(rgba(var(--color1), calc(var(--opacity1) * var(--opacity))) var(--light1-blur-size), rgba(var(--color2), calc(var(--opacity2) * var(--opacity))) calc(var(--light1-blur-size) * 1.3) var(--light2-blur-size), transparent var(--transparency-blur-size)) !important;
    -webkit-mask-size: var(--animation-width);
}

[data-animation='bubble-fx'] .islight:before,
.aura-element[data-animation='bubble-fx'][id*='aura_']:before
{
    animation: bubble 6s infinite 3s linear;
    transform: scale(var(--animation-scale)) rotate(calc(1deg * var(--animation-rotation, 0)));
    rotate:200deg;
}

.video-meet-area{
    z-index: 100;
    position: fixed;
    bottom: 0px;
    width: calc(100vW - 360px);
    min-height: 133px;
    height: fit-content;
    padding-bottom: 26px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap-reverse;
    align-items: stretch;
    align-content: center;
    pointer-events: none;
}
.meet-controls-bar{
    position: absolute;
    bottom: 0px;
    pointer-events: auto;
}
.meet-controls-bar select{
    background: none rgb(255, 255, 255);
    border: 1px solid rgb(221, 221, 221);
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
    color: rgb(0, 0, 0);
    padding: 4px;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}

#peerVideo_mute_mic.muted{
    background:#d86565;
}

#peerVideo_echo_cancel,
#peerVideo_noise_sup{
float: right;
    height: 27px;
    background: #fff;
    border: 0px;
    border-radius: 5px;
    font-family: Roboto, Helvetica, sans-serif;
    font-size: 100%;
    margin: 0px;
    vertical-align: baseline;
    color: #000;
    padding: 1px 6px;
    margin-left: 3px;
    transition: none;
}
#peerVideo_echo_cancel.enabled,
#peerVideo_noise_sup.enabled{
    box-shadow: inset #009500 0px 0px 0px 2px;
    color: #009500;
}
#peerVideo_mute_mic span:before{
    content:"\e029";
    font-family: "Material Symbols Outlined", sans-serif !important;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}
#peerVideo_mute_mic.muted span:before{
    content:"\e02b";
}

    
   
#peerVideo_close span.material-icons.button-icon
{
    margin: -3px -3px;
    bottom: -3px;
    position: relative;
}
.video-meet-area video {
    width: 200px;
    margin: 5px 0px 0px 5px;
    pointer-events: auto;
    background: var(--token-image, #000) center top no-repeat, #00000070;
    border: ridge 3px #555555;
    box-shadow: inset 1px 1px 3px #000;
    background-size:contain;
    object-fit:fill;
}

.video-meet-area video::-webkit-media-controls-panel {
    border-radius: 0px;
    color: #fff;
    background:transparent;
    bottom:0px;
    position:relative;
    height:100%;
}



.video-meet-area video::-webkit-media-controls-enclosure {
    width:100%;
    background-color:#80808091;
    border-radius: 0px;
    display: none;
    position:absolute;
    max-height:40px;
    padding:0px !important;
}

.video-meet-area video:hover::-webkit-media-controls-enclosure {
    display: flex;
}

.dice-rolling-panel .dice-toolbar,
.dice-rolling-panel [class*='DiceContainer_button']{
    bottom: 35px !important;
}
[data-floating-ui-portal].hidden,
.roll-mod-container.hidden{
    visibility:hidden;
}
@keyframes bubble {
     0%{
        --opacity: 0;
        --animation-scale: 1;
    }
    50%{
         --opacity: 1;
    }
    100%{
        --animation-scale: 1.4;
        --opacity: 0;
    }
}



@keyframes lightning {
    0%{
        --animation-scale: 3.5;
        --opacity: 0;
    }
    20%{
        --animation-scale: 3.5;
        --opacity: 0;
    }
    21%{
       --animation-scale: 3.5;
       --opacity: 1;
    }
    25%{
        --opacity: 0;
        --animation-scale: 3.5;
    }
    70%{
        --animation-scale: 5.5;
        --opacity: 0;
    }
    71%{
       --animation-scale: 5.5;
       --opacity: 1;
    }
    75%{
        --animation-scale: 5.5;
        --opacity: 0;
    }
    100%{
        --animation-scale: 5.5;
        --opacity: 0;
    }
}

@keyframes snow {
    0%{
        --opacity: 0;
        --animation-scale: 1;
        --animation-rotation: calc(var(--starting-deg) + 200);
    }
    25%{
        --animation-rotation: calc(var(--starting-deg) + 200);
        --opacity: 1;
    }
    50%{
        --animation-rotation: calc(var(--starting-deg) + 200);
        --opacity: 0;
    }
    51%{
        --animation-rotation: var(--starting-deg) + 200;
        --opacity: 0;
    }
    75%{
        --animation-rotation: var(--starting-deg) + 200;
        --opacity: 1;
    }
    100%{
        --animation-rotation: var(--starting-deg) + 200;
        --animation-scale: 0.5;
        --opacity: 0;
    }
}



@keyframes aurafx-fairy {
    0% {
        --animation-scale: 0.98;
        --animation-rotation: 0;
    }
    50% {
         --animation-scale: 1;
        --animation-rotation: 180;
    }
    100% {
        --animation-scale: 0.98;
        --animation-rotation: 360;
    }
}
@keyframes aurafx-fairy2 {
    0% {
        --animation-scale: 1.5;
        --animation-rotation: 360;
    }
    50% {
        --animation-scale: 1;
        --animation-rotation: 180;
    }
    100% {
        --animation-scale: 1.5;
        --animation-rotation: 0;
    }
}
@property --light1-blur-size-animated {
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}

@property --light2-blur-size-animated{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --transparency-blur-size-animated{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --opacity{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --animation-scale{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --animation-rotation{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --animation-skew-x{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}
@property --animation-skew-y{
  syntax: '<number>'; /* <- defined as type number for the transition to work */
  initial-value: 1;
  inherits: false;
}








@keyframes aurafx-flicker{
      0% { 
        --opacity: 0.7;
        --light1-blur-size-animated: 0.7;
        --light2-blur-size-animated: 0.8;
        --transparency-blur-size-animated: 1.2;
      }
      100% {
        --opacity: 1;
        --light1-blur-size-animated: 0.8;
        --light2-blur-size-animated: 0.8;
        --transparency-blur-size-animated: 1.3;
      }
}
@keyframes aurafx-rotate{
    from {
        --animation-rotation: 0;
   
      }
      to {
         --animation-rotation: 360;
      }
}

@keyframes lightning-circle-fx{
    0% {
        --opacity:1;
        -webkit-mask-image: var(--mask-1);
    }
    5%{
        --opacity:0;
    }
    26.3% {
        --opacity:0;
        -webkit-mask-image: var(--mask-1);
    }

    27.7% {
        --opacity:1;
        -webkit-mask-image: var(--mask-2);
    }
    30%{
        --opacity:0;
    }
    36%{
        --opacity:0;
         -webkit-mask-image: var(--mask-2);
    }
    37% {
         --opacity:1;
        -webkit-mask-image: var(--mask-3);
    }
    40%{
        --opacity:0;
    }
    48%{
         --opacity:0;
          -webkit-mask-image: var(--mask-3);
    }
    50% {
         --opacity:1;
        -webkit-mask-image: var(--mask-2);
    }
    55%{
        --opacity:0;
    }
    66%{
         --opacity:0;
          -webkit-mask-image: var(--mask-2);
    }
    67% {
         --opacity:1;
        -webkit-mask-image: var(--mask-3);
    }
    70%{
        --opacity:0;
    }
    81%{
         --opacity:0;
          -webkit-mask-image: var(--mask-3);
    }
    82% {
         --opacity:1;
        -webkit-mask-image: var(--mask-1);
    }
    85%{
        --opacity:0;
    }
    93%{
         --opacity:0;
          -webkit-mask-image: var(--mask-1);
    }
    94% {
         --opacity:1;
        -webkit-mask-image: var(--mask-2);
    }
    98%{
        --opacity:0;
    }
    99%{
         --opacity:0;
          -webkit-mask-image: var(--mask-2);
    }
    100% {
         --opacity:1;
        -webkit-mask-image: var(--mask-1);
    }
    
}
@keyframes aurafx-wild{
    from {
        --animation-rotation: 0;
        --animation-skew-x: 5;
        --animation-skew-y: 0;
      }
      to {
        --animation-rotation: 360;
        --animation-skew-x: 0;
        --animation-skew-y: 5;
      }
}
@keyframes aurafx-wild-hue{
    from {
        --animation-rotation: 0;
        --animation-skew-x: 5;
        --animation-skew-y: 0;
      }
      to {
        --animation-rotation: 360;
        --animation-skew-x: 0;
        --animation-skew-y: 5;
      }
}
@keyframes aurafx-force{
    from {
        --animation-scale: 0.99;
      }
      to {
        --animation-scale: 1;
      }
}












.general_input{
    border-width: 2px;
    border-radius: 2px;
    border-color: #ddd;
    background-image: -webkit-linear-gradient(top, #fff, #e6e6e6);
    color: #3d3d3d;
    height: 22px;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
    padding: 1px 1px;
    transition: color 0.3s ease-in-out, background 0.3s ease-in-out, background-color 0.3s ease-in-out, background-image 0.1s ease-in-out;
    border: 1px solid lightgray;
    font-size: 12px;
    margin: 1px;
    top: 0px;
    text-transform: uppercase;
}
.menu_hp_input{
    border-width: 0;
    background: none;
    border-radius: 3px;
    border-color: #ddd;
    height:22px;
    font-size: 18px !important;
    top: 1px;
    width: 45%;
    display:inline-block;
}

.light_preset_title,
.animation_preset_title,
.animation_preset_mask,
.aura_preset_title{
    background-color: #fff;
    background: #fff none;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    color: #000;
    padding: 4px;
    width: 100%;
    -webkit-transition: .2s linear border,0.2s linear box-shadow;
    -moz-transition: .2s linear border,0.2s linear box-shadow;
    transition: .2s linear border,0.2s linear box-shadow;
}


div#addLightPreset,
div.removePreset,
div#addAnimationPreset,
div#addAuraPreset{
    font-size:30px;
    text-align:center;
    line-height:100%;
    font-weight:600;
    color: #0a0;
    margin:10px 20px;
    border-radius:5px;
    border:1px solid #000;
    width:30px;
    height:30px;
    cursor: pointer;
    box-sizing: border-box;
    padding: 0px 0px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    opacity: 0.8;
    outline: none;
    background: rgb(235, 241, 245);
    transform: scale(0.8);
}



table#light_presets_properties th,
table#aura_presets_properties th {
    position:sticky;
    top:10px;
    z-index:1;
}
table#light_presets_properties tr,
table#aura_presets_properties tr{
    display: table-row;
}
table#light_presets_properties :is(td, th),
table#aura_presets_properties :is(td, th) {
    display: table-cell;
    vertical-align: middle;
}
table#light_presets_properties,
table#aura_presets_properties  {
   display:table;
    border-collapse: unset;
    border-spacing: 10px;    
}
table#light_presets_properties :is(td, th):has(.token-image-modal-footer-title) {
    width: 120px;
}
table#light_presets_properties div.token-image-modal-footer-title{
    font-size: 8px;
}
#light_presets_properties div.removePreset svg rect,
#animation_presets_properties div.removePreset svg rect,
#aura_presets_properties div.removePreset svg rect{
    fill: #F00;
    height: 80px;
    width: 10px;
    transform: translate(45px, 10px);
}
td.animation-aura .light-animation-select,
td.animation-aura .aura-animation-select {
    min-width:100%;
    max-width:100%;
}
#light_presets_properties div.removePreset,
#animation_presets_properties div.removePreset,
#aura_presets_properties div.removePreset{
    fill: #d00;
    width:20px;
    height:20px;
    margin:0px !important;
    display:flex; 
    top:-15px;
}

table#animation_presets_properties td .rc-switch {
    left:50%;
    translate: -50%
}

table#animation_presets_properties th:nth-of-type(4),
table#animation_presets_properties th:nth-of-type(3){
   width:8%;
}

#animation_presets_properties{
    margin:10px 0px;
}
#edit_preset_light_dialog,
#edit_preset_animation_dialog,
#edit_preset_aura_dialog{
    height: 100%;
    overflow-y: scroll;
}
button#editPresets,
button#editAnimations,
button#editAuras  {
    font-size:10px;
    font-weight: 600;
    color: #9f9f9f;
    background:none;
    border-radius:5px;
    outline: none;
    border: 1px solid #ddd;
    left:-45px;
    height: 20px;
    position:relative;
    cursor: pointer;
}
button#editAnimations {
    left: -40px;
}
#qrm_dialog .roll_mods_button {
    display: block;
    margin: 0px;
    padding: 0px;
    height: 40%;
}
.roll_mods_button:before {
    width: 100%;
    height: 100%;
    min-width: 12px;
    min-height: 12px;
    top: 0px; 
    margin-right: 0px;
    left: 1px
}
.roll_mods_button:focus {
    outline: none;
    box-shadow: none;
}
#qrm_healing.active_roll_mod, #adv.active_roll_mod{
    background-image: none !important;
    background: green;
    border-radius: 3px !important;
    border-color: #ddd !important;
}
#qrm_damage.active_roll_mod, #disadv.active_roll_mod{
    background-image: none !important;
    background: red;
    border-radius: 3px;
    border-color: #ddd;
}
#qrm_heal.active_roll_mod{
    background-image: none !important;
    background: green;
    border-radius: 3px !important;
    border-color: #ddd !important;
}
#qrm_damage.active_roll_mod{
    background-image: none !important;
    background: red;
    border-radius: 3px;
    border-color: #ddd;
}
.adjustments_wrapper{
    position: relative;
    display: inline-block;
}
.damage_heal_button{
    display: block;
    height: 50% !important;
    font-size: 8px !important;
    text-align: center;
    overflow: unset!important;
    padding: 0px!important;
    width: 50px;
    margin: 1px !important;
}
.ui-selectmenu-menu.ui-front{
    z-index: 100000000 !important;
}
.ui-selectmenu-menu .ui-menu-item-wrapper .ui-menu-item {
    height: 24px;
    width: 24px;
    top: 0.1em;
    overflow: auto;
    position: relative;
}
.ui-selectmenu-menu .ui-menu {
    max-height: calc(50vh - 20px);
    width: 140px;
    overflow: auto !important;
}
#qrm_apply_conditions-button{
    width: 26% !important;
}

.ui-selectmenu-text{
    top: 1px;
    position: relative;
}
.ui-menu .ui-menu-item-wrapper{
    display: inline-block;
    padding-right: 100px !important;
    max-width: 175px;
    white-space: nowrap;
    text-transform: uppercase;
}
.icon-avatar{
    width: 22px;
    height: 22px;
}
.ui-selectmenu-button.ui-button{
    width: 22% !important;
    padding: 2px 2px !important;
    border-width: 2px;
    border-radius: 2px;
    border-color: #ddd;
    background-image: -webkit-linear-gradient(top, #fff, #e6e6e6);
    color: #3d3d3d;
    height: 22px;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
    transition: color 0.3s ease-in-out, background 0.3s ease-in-out, background-color 0.3s ease-in-out, background-image 0.1s ease-in-out;
    border: 1px solid lightgray;
    font-size: 12px;
    margin: 1px;
    top: -1px;
}
.ui-menu .ui-icon{
    background-image: none;
    background-repeat: no-repeat;
    background-size: contain;
}
.dropdown-advantage {
    background-image: url(assets/conditons/advantage.png) !important;
}
.dropdown-baned {
    background-image: url(assets/conditons/baned.png) !important;
}
.dropdown-bardic {
    background-image: url(assets/conditons/bardic_inspiration.png) !important;
}
.dropdown-blessed{
    background-image: url(assets/conditons/blessed.png) !important;
}
.dropdown-bloodied {
    background-image: url(assets/conditons/bloodied.png) !important;
}
.dropdown-concentration-reminder {
    background-image: url(assets/conditons/concentration\(reminder\).png) !important;
}
.dropdown-disadvantage {
    background-image: url(assets/conditons/disadvantage.png) !important;
}
.dropdown-burning {
    background-image: url(assets/conditons/burning.png) !important;
}
.dropdown-flying {
    background-image: url(assets/conditons/flying.png) !important;
}
.dropdown-hasted {
    background-image: url(assets/conditons/hasted.png) !important;
}
.dropdown-bardic-inspiration {
    background-image: url(assets/conditons/bardic_inspiration.png) !important;
}
.dropdown-rage {
    background-image: url(assets/conditons/rage.png) !important;
}
.dropdown-remove {
    background-image: url(assets/icons/delete.svg) !important;
}
/* end quick roll menu */

/*Audio Mixer Start*/
li.audio-row:hover .channel-progress-bar-total .channel-progress-bar-progress,
li.audio-row:hover .channel-progress-bar-total
{
    height:5px !important;
}
.channel-progress-bar-total,
.channel-progress-bar-progress{
    transition: 150ms height linear 500ms;
}
#sounds-panel .channel-progress-bar-progress{
    background: #1b9af0 !important;
}

.token-image[src*='assets/icons/speaker.svg']{
    filter: invert(1) drop-shadow(1px 1px 0px #000) !important;
}
.token>.token-image{
    background-position: calc(50% + var(--offsetX)) calc(0% - var(--offsetY)) !important;
    background-origin: border-box !important;
}
.token.underDarkness>.token-image{
    background-position: calc(50% + calc(var(--offsetX) / var(--scene-scale, 1))) calc(0% - calc(var(--offsetY) / var(--scene-scale, 1))) !important;
}
.token>.base~.token-image,
.token>.token-image.freeform{
    background-position: calc(50% + var(--offsetX)) calc(50% - var(--offsetY)) !important;
}
.token.underDarkness>.base~.token-image,
.token.underDarkness>.token-image.freeform{
    background-position: calc(50% + calc(var(--offsetX) / var(--scene-scale, 1))) calc(50% - calc(var(--offsetY) / var(--scene-scale, 1))) !important;
}

#tokens .audio-token.token:not(.underDarkness),
#map_items .audio-token.token{
    background: #060b04;
    border: #ea2524 2px solid;
}
#sounds-panel .channel-progress-bar-total{
    width: 35%;
}
#sounds-panel .volume-control{
    width: 40%;
}
.audio-row input{
    top: 4px;
    position:relative;
    -webkit-appearance: none;
    width: 100%;
    height: 7px;
    border-radius: 5px;
    background: #d3d3d3;
    outline: none;

}
#mixer-channels{
    overflow-y: auto;
    padding-bottom: 2px;
    max-height: calc(100% - 68px);
}
#sounds-panel .sidebar-panel-header{
    max-height: calc(100% - 16px);
    min-height: 150px;
}
#mixer-channels .volume-control{
    left: 0;
    width: calc(40% + 2px)
}
#mixer-channels .audio-row input{
    top: 8px;
}
#mixer-channels .audio-row{
    margin-left: 5px;
}
.audio-row input::-webkit-slider-thumb{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 4px;
    height: 13px;
    background: #899197;
    background-color: #899197;
    border-radius:5px;
    cursor: pointer;
    box-shadow: 1px 1px 1px 0px #000;
    border:1px solid #fff9;
    border-width: 1px 0px 0px 1px;
}

.audio-row input::-moz-range-thumb {
-moz-appearance: none;
    appearance: none;
    width: 4px;
    height: 13px;
    background: #899197;
    background-color: #899197;
    border-radius:5px;
    cursor: pointer;
    box-shadow: 1px 1px 1px 0px #000;
    border:1px solid #fff9;
    border-width: 1px 0px 0px 1px;
}
#sounds-panel .sidebar-panel-header {
    background: #ebf1f5;
    color: #000;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    overflow: visible;
    flex-shrink: 0;
}
#sounds-panel .sidebar-panel-header .ui-resizable-s {
    z-index: 3 !important;
}
#sounds-panel .sidebar-panel-body {
    position: relative;
    z-index: 1;
}
#sounds-panel .sidebar-panel-header button{
    border-radius: 5px;
}
#sounds-panel .sidebar-panel-header button{
    box-shadow: inset 1px 1px 4px -2px #a0a0a0e3, 2px 2px 2px -1px #000000a3, 0px 1px 1px 0px #0006;
}
#sounds-panel .sidebar-panel-header button svg{
    transform: scale(0.8);
}
#sounds-panel .sidebar-panel-header button:active,
#sounds-panel .sidebar-panel-header button.pressed:active{
    box-shadow: inset 2px 1px 3px -1px #000, inset 1px 2px 3px -1px #000;
    border: 1px solid tranparent;
}

#sounds-panel .sidebar-panel-header svg path{
    fill: #000;
}
div#sounds-panel {
    overflow-y: hidden;
}


button.channel-loop-button{
    left: 20px;
}

.channelNameOverflow,
.trackNameOverflow {
    width: 100px;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 16px;
}
.trackNameOverflow{
    width: 230px;
}
.channelNameOverflow:hover .channelName,
.trackNameOverflow:hover .track-name {
    margin-left: var(--name-width-overflow);
}

.channelName,
.track-name{
    transition: margin var(--overflow-speed, 800ms) linear 250ms;
    text-overflow: ellipsis;
    display: inline;
}
#mixerPlaylists{
    width: 100px;
    margin: 0px 0px 0px 5px;
}
#mixerPlaylists ~ button#add-playlist, 
#mixerPlaylists ~ button#remove-playlist {
    box-shadow: 1px 1px 1px 1px #0003, 1px 2px 0px -2px #0003;
    border: 1px solid transparent;
    box-sizing: border-box;
    border-radius: 5px;
    width: fit-content;
    font-size: 12px;
    height: 16px;
    margin: 0px 4px;
    color: rgb(111, 116, 120);
    padding: 0px 3px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: #000000;
    opacity: 0.8;
    outline: none;
    background: rgb(235, 241, 245);
}   

.mixer-play-pause-button,
.track-play-pause-button,
.mixer-clear-button,
.channel-play-pause-button,
.channel-loop-button,
.track-remove-button,
.add-track-ok-button,
.add-track-cancel-button,
.channel-remove-button,
.track-add-to-mixer,
.track-add-token-mixer,
.sequential-button,
.cross-fade-button {
    box-shadow: 1px 1px 1px 1px #0003, 1px 2px 0px -2px #0003;
    border: 1px solid transparent;
    box-sizing: border-box;
    border-radius: 5px;
    width: 24px;
    height: 24px;
    color: rgb(111, 116, 120);
    padding: 0px 0px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: #000000;
    opacity: 0.8;
    outline: none;
    background: rgb(235, 241, 245);
    transform: scale(0.8);
}
.mixer-play-pause-button:focus,
.track-play-pause-button:focus,
.mixer-clear-button:focus,
.channel-play-pause-button:focus,
.channel-loop-button:focus,
.track-remove-button:focus,
.add-track-ok-button:focus,
.add-track-cancel-button:focus,
.channel-remove-button:focus,
.track-add-to-mixer:focus,
.track-add-token-mixer:focus,
.sequential-button:focus,
.cross-fade-button:focus {
    outline: none;
}

.mixer-play-pause-button:hover,
.track-play-pause-button:hover,
.mixer-clear-button:hover,
.channel-play-pause-button:hover,
.channel-loop-button:hover,
.track-remove-button:hover,
.add-track-ok-button:hover,
.add-track-cancel-button:hover,
.channel-remove-button:hover,
.track-add-to-mixer:hover,
.track-add-token-mixer:hover,
.sequential-button:hover  {
    cursor: pointer;
    background: rgb(245, 248, 250);
    border: 1px solid rgb(206, 217, 224);
}

.mixer-play-pause-button:active,
.mixer-clear-button:active,
.track-play-pause-button:active,
.channel-play-pause-button:active,
.channel-loop-button:active,
.track-remove-button:active,
.add-track-ok-button:active,
.add-track-cancel-button:active,
.channel-remove-button:active,
.track-add-to-mixer:active,
.track-add-token-mixer:active,
.sequential-button:active,
.cross-fade-button:active {
    background-color: rgb(245, 248, 250);
    box-shadow: inset #000 1px 1px 3px 1px;
    transform: translate(1px, 2px) scale(0.8);
}



#mixerPlaylists ~ button#add-playlist:active, 
#mixerPlaylists ~ button#remove-playlist:active{
    background-color: rgb(245, 248, 250);
    box-shadow: inset #000 1px 1px 3px 1px;
    transform: translate(1px, 2px);
} 
.track-add-to-mixer{
   fill:#000;
   padding: 5px 4px 5px 4px; 
}
.track-add-to-mixer svg path{
    fill:#000;
}

.channel-play-pause-button,
.channel-loop-button,
.channel-remove-button{
    float:  right;
}
.channel-remove-button{
    color: #000;
    font-size: 18px;
}
input.trackName.trackInput {
    width: 100px;
}

div#importTrackFields input,
div#editTrackFields input {
    width: 100px;
    margin: 0px 5px 0px 0px;
}
.add-track-ok-button,
.add-track-cancel-button{
    left: 4px;
    position: relative;
}

.trackTags{
    width:258px !important;
}

div#importTrackFields input.trackSrc,
div#editTrackFields input.trackSrc  {
    width: 145px;
}
div#editTrackFields button,
div#editTagsFields button{
    float: initial;
    height: 24px;
    vertical-align:top;
}
div#importTrackFields,
div#playlistFields {
    height: 0px;
    overflow: hidden;
    margin: 5px 0px;
    transition: height ease 250ms;
}
#sounds-panel .sidebar-panel-header button.pressed {
    background: #7dc8fd66 !important;
    border: none;
    box-shadow: inset #000 1px 1px 3px 0px;
    transform: translate(0px, 1px) scale(0.8);
}
.mixer-clear-button{
    position: absolute;
    left: 102px;
}
.sequential-button {
    position: absolute;
    left: 126px;
}
.cross-fade-button {
    position: absolute;
    left: 150px;
}
.mixer-play-pause-button{
    position: absolute;
    left: 174px;
}
.glc-game-log #chat-language{
    --border-color: #0008;
}
.ct-sidebar--is-dark-mode .glc-game-log #chat-language{
    --border-color: #3d3d3d;
}
.glc-game-log #chat-language{
    outline: none;
    margin-top: 8px;
    float: left;
    position: absolute;
    right: 20px;
    bottom: 65px;
    border-radius: 0px 5px 5px 0px;
    padding: 0px;
    width: 19px;
    height: 30px;
    background: none;
    border: none;
    max-height: 100px;
    border-image: linear-gradient(to top, transparent 0% 25%, var(--border-color, #0008) 25% 75%, transparent 75%) 1;
    border-width: 0px 0px 0px 1px;
    border-style: solid; 
    margin-right: 3px;
    font-size:20px;
    text-indent: 20px;
}

#chat-language option {
    background: var(--theme-background-solid, #fff);
    font-size:12px;
}

/***** NEW STAT BLOCKS ****/


.stat-block {
    --compendium-p-bottom: 0;
    border: 1px solid #a7a3a0;
    background-color: #fefcef;
    padding: 10px;
    position: relative;
    background-repeat: no-repeat;
    box-shadow: 0 5px 8px 0 var(--stat-block-shadow,#aaa);
    background-position: top;
    background: var(--stat-block-bg-override,#f6f3ee);
    font-size: 16px;
    line-height: 19.6px;
    border-radius: 8px;
    outline: 1px solid #a7a3a0;
    outline-offset: -4px;
    font-family: var(--stat-block-font,Roboto,Helvetica,sans-serif);
    columns: 384px 2
}

.stat-block :is(h2,h3,h4,h5) {
    --header-font-override: 22px;
    font-family: Roboto Condensed;
    text-transform: uppercase;
    font-weight: 700;
    margin-right: 8px;
    margin-block-end:0}

.stat-block :is(h2,h3,h4,h5):after {
    content: "";
    display: block;
    width: 100%;
    margin: 2px auto 8px;
    height: 1px;
    background: var(--monster-header-underline,#7a3c2f);
    column-span: all
}

.stat-block p {
    break-inside: avoid;
    font-size: 15px;
    line-height: 1.4
}

.stat-block p+p {
    --compendium-p-top: 10px
}

.stat-block p[class]:first-of-type {
    margin-top: 0;
    font-style: italic;
    opacity: .8
}

.stat-block p[class]:first-of-type+p {
    --compendium-p-top: 16px
}

.stat-block :is(ol,ul,dl) {
    margin-bottom: 0;
    padding-top: 0
}


p.monster-header+p {
    break-before: avoid
}

.stat-block .stats {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.glc-game-log .stat-block .stats{
    flex-direction:column;
}
.glc-game-log .stat-block .stats>table{
    margin:0px;
}
.glc-game-log .stat-block{
    color: var(--theme-contrast);
}
.ct-sidebar .glc-game-log .stat-block .stats table tbody tr button.avtt-roll-button,
.ct-sidebar .glc-game-log .stat-block .stats table tbody tr:hover button.avtt-roll-button{
    background-color: #fff;
}
.ct-sidebar__inner>[class*='styles_pane']>[class*='styles_content']{
    padding: 0px; 
}

.ct-sidebar__inner>[class*='styles_pane']>[class*='styles_content'] .glc-game-log{
    background: #FEFEFE;
}

.ct-sidebar__inner>[class*='styles_pane']>[class*='styles_content'][class*='styles_dark'] .glc-game-log{
    background: #12181c;
}

.stat-block p{
    margin-bottom: 10px;
}
.stat-block .mon-stat-block__attribute-label,
.stat-block .mon-stat-block__attribute-data-value,
.stat-block .mon-stat-block__tidbits span,
.stat-block .mon-stat-block__attribute-data-extra,
.stat-block .mon-stat-block__meta
{
    font-size:14px;
    color: #000;
}
.stat-block .mon-stat-block__meta{
    color: #68747b;
    margin-bottom: .938rem;
    margin-top: .188rem;
}
.stat-block :is(p, a.tooltip-hover, button, td, th, li){
    font-size:14px;
}
.stat-block .stats table tr td{
    text-align: center;
}
.stat-block .stats table.abilities-saves tbody td{   
    padding: .125rem .5rem !important;
}
.stat-block .stats+p {
    margin-top: 10px
}
:is(p.monster-header, .monster-header) {
    padding-top: 4px;
    letter-spacing: .35px;
    font-weight: 500;
    color: var(--monster-header-color, #5b160c);
    font-size: var(--monster-trait-header-size, 22px);
    font-family: var(--monster-trait-header-font, "Roboto Condensed", Helvetica, sans-serif);
    border-bottom: 2px solid var(--monster-header-underline, #7a3c2f);
    font-variant: small-caps;
}
.stat-block .stats table.abilities-saves {
    --theme-table-row-color: transparent;
    flex: 1 1 auto;
    line-height: 24px;
    background: revert;
    border: none;
    font-size: 16px;
    break-inside: avoid;
    border-collapse: collapse;
    border-spacing: 0;  
}
.stat-block .stats table.abilities-saves{
    width:unset;
}
.stat-block .stats table.abilities-saves.physical {
    --stats-score: #ede6d9;
    --stats-mods: #ded4cc;
    --stats-score-hover: rgba(153,127,109,0.49019607843137253);
    --stats-mods-hover: rgba(153,109,114,0.49019607843137253)
}

.stat-block .stats table.abilities-saves.mental {
    --stats-score: #d8dad1;
    --stats-mods: #d0caca;
    --stats-score-hover: rgba(109,141,153,0.49019607843137253);
    --stats-mods-hover: rgba(117,109,153,0.49019607843137253)
}

.stat-block .stats table.abilities-saves thead {
    border: none;
    height: revert;
    min-height: 45px
}

.stat-block .stats table.abilities-saves thead tr {
    height: revert;
    min-height: 45px
}

.stat-block .stats table.abilities-saves thead tr th {
    padding: 5px 2px 0!important;
    background: inherit;
    color: inherit;
    vertical-align: bottom;
    border: none;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px
}

.stat-block .stats table.abilities-saves tbody {
    border: none
}

.stat-block .stats table.abilities-saves tbody tr {
    background-color: var(--theme-table-row-color,#fdfdfd);
    color: var(--theme-table-header-fg-color,#222)
}

.stat-block .stats table.abilities-saves tbody tr:hover {
    background-color: var(--stats-hover)
}

.stat-block .stats table.abilities-saves tbody tr:hover :nth-child(-n+3) {
    background-color: var(--stats-score-hover)
}

.stat-block .stats table.abilities-saves tbody tr:hover :nth-child(n+3) {
    background-color: var(--stats-mods-hover)
}

.stat-block .stats table.abilities-saves tbody tr :nth-child(-n+3) {
    background-color: var(--stats-score)
}

.stat-block .stats table.abilities-saves tbody tr :nth-child(n+3) {
    background-color: var(--stats-mods)
}

.stat-block .stats table.abilities-saves tbody th {
    text-transform: uppercase;
    font-weight: 700;
    border: none;
    padding-left: 6px;
    font-size: 16px
}

.stat-block .stats table.abilities-saves tbody td {
    min-width: revert;
    padding: 5px 10px!important;
    border: none;
    font-size: 16px
}

.stat-block .stats table.abilities-saves tr :is(th,td) {
    transition: background-color .3s
}

.stat-block p:nth-of-type(2) strong+strong {
    margin-left: 30px
}
.stat-block figure {
    position: static;
    margin: 0 auto
}

.stat-block figure .artist-credit {
    text-align: end;
    right: 0;
    left: 0;
    bottom: -6px;
    top: unset
}


.dnd-page [contenteditable="true"]{
    cursor: text;
}
.dnd-sheet {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #111;
    background-color: #fff;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 11px;
    line-height: 1.2;

    .dnd-page {
        border: 2px solid #222;
        padding: 15px;
        margin-bottom: 30px;
        background: #fff;
        page-break-after: always;
        box-sizing: border-box;
    }
    .header-box {
        border: 2px solid #222;
        padding: 8px;
        margin-bottom: 10px;
        display: flex;
        gap: 8px;
        background: #f4f4f4;
        box-sizing: border-box;
    }
    .header-box .col {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        box-sizing: border-box;
    }
    .header-box .char-name-box {
        flex: 2;
    }
    .box-field {
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        min-height: 24px;
        height: auto;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .label {
        font-size: 8px;
        text-transform: uppercase;
        color: #555;
        text-align: center;
        display: block;
        margin-top: 2px;
        font-weight: bold;
    }
    .main-container {
        display: flex;
        gap: 10px;
        box-sizing: border-box;
    }
    .left-column {
        width: 170px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        box-sizing: border-box;
    }
    .abilities-table-container, .skills-box {
        border: 1px solid #333;
        padding: 6px;
        background: #fff;
        border-radius: 4px;
        box-sizing: border-box;
    }
    .section-title {
        font-size: 10px;
        font-weight: bold;
        text-align: center;
        background: #222;
        color: #fff;
        padding: 3px;
        margin-bottom: 6px;
        border-radius: 2px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .add-table-row{
        outline: none;
        margin-top: 0;
        margin-bottom: 0;
        display: block;
        width: 100%;
        text-align: center;
        border: none;
        background: none;
        color: var(--pc-template-text-color, #999999);
        font-weight: 800;
        font-size: 16px;
        line-height: 18px;
    }
    table {
        width: 100%;
        border-collapse: collapse;
        text-align: center;
        font-size: 11px;
    }
    th {
        padding: 2px;
    }
    thead tr {
        border-bottom: 1px solid #333;
        font-size: 8px;
        text-transform: uppercase;
        color: #555;
    }
    thead th:first-child {
        text-align: left;
    }
    tbody tr {
        border-bottom: 1px solid #eee;
        height: 25px;
    }
    tbody tr td {
        padding: 3px 2px;
    }
    tbody tr td:first-child {
        font-weight: bold;
        text-align: left;
        text-transform: uppercase;
        font-size: 8.5px;
    }

    .ability-score-field {
        display: inline-block;
        width: 22px;
        border: 1px solid #444;
        padding: 2px;
        background: #fdfdfd;
        min-height: 14px;
        border-radius: 2px;
        box-sizing: border-box;
    }
    .skill-row {
        display: flex;
        align-items: center;
        font-size: 9.5px;
        margin-bottom: 3px;
        gap: 4px;
    }
    .skill-row input {
        margin: 0;
    }
    .mod-bullet {
        min-width: 24px;
        height: 24px;
        border: 1px solid #444;
        text-align: center;
        font-size: 11px;
        line-height: 24px;
        background: #f4f4f4;
    }
    .skill-row span {
        color: #777;
        font-size: 8px;
    }
    .mid-column {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 10px;
        box-sizing: border-box;
    }
    .combat-stats-grid {
        display: flex;
        gap: 6px;
        text-align: center;
        box-sizing: border-box;
    }
    .combat-metric {
        border: 2px solid #333;
        padding: 6px;
        flex: 1;
        background: #fdfdfd;
        border-radius: 4px;
        box-sizing: border-box;
    }
    .metric-val {
        font-size: 16px;
        font-weight: bold;
        margin-top: 4px;
    }
    .hp-box {
        border: 1px solid #333;
        padding: 6px;
        border-radius: 4px;
        box-sizing: border-box;
    }
    .hp-row {
        display: flex;
        gap: 6px;
        margin-bottom: 6px;
        box-sizing: border-box;
    }
    .hp-row .col {
        flex: 1;
        box-sizing: border-box;
    }
    .hp-subgrid {
        display: flex;
        gap: 4px;
        box-sizing: border-box;
    }
    .hp-subgrid > div {
        flex: 1;
        box-sizing: border-box;
    }
    .container-block {
        border: 1px solid #333;
        padding: 6px;
        border-radius: 4px;
        min-height: 110px;
        height: auto;
        background: #fff;
        box-sizing: border-box;
    }
    .container-block.flex-1 {
        flex: 1;
    }
    .attacks-field {
        min-height: 120px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .features-field {
        min-height: 180px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .equipment-field {
        min-height: 139px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .page2-grid {
        display: flex;
        gap: 10px;
        box-sizing: border-box;
    }
    .page2-grid > .col {
        flex: 1;
        box-sizing: border-box;
    }
    .bio-block {
        border: 1px solid #333;
        padding: 6px;
        border-radius: 4px;
        margin-bottom: 8px;
        background: #fff;
        box-sizing: border-box;
    }
    .bio-appearance { min-height: 90px; height: auto; border: 1px solid #444; padding: 4px; background: #fdfdfd; border-radius: 3px; box-sizing: border-box; overflow-wrap: break-word; }
    .bio-backstory { min-height: 140px; height: auto; border: 1px solid #444; padding: 4px; background: #fdfdfd; border-radius: 3px; box-sizing: border-box; overflow-wrap: break-word; }
    .bio-allies { min-height: 90px; height: auto; border: 1px solid #444; padding: 4px; background: #fdfdfd; border-radius: 3px; box-sizing: border-box; overflow-wrap: break-word; }
    .bio-traits-add { min-height: 100px; height: auto; border: 1px solid #444; padding: 4px; background: #fdfdfd; border-radius: 3px; box-sizing: border-box; overflow-wrap: break-word; }
    .traits-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        box-sizing: border-box;
    }
    .trait-box-field {
        min-height: 60px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .attunement-content {
        font-size: 11px;
        margin-top: 4px;
        box-sizing: border-box;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        overflow-wrap: break-word;
    }
    .attunement-content > div {
        margin-bottom: 2px;
    }
    .currency-container {
        display: flex;
        justify-content: space-between;
        margin-bottom: 6px;
        margin-top: 4px;
        box-sizing: border-box;
    }
    .coin-slot {
        display: flex;
        align-items: center;
        gap: 4px;
        font-size: 11px;
        font-weight: bold;
        border: 1px solid #555;
        padding: 2px 4px;
        border-radius: 3px;
        background: #f9f9f9;
        box-sizing: border-box;
    }
    .coin-input {
        width: 40px;
        min-height: 24px;
        height: auto;
        border: 1px solid #ccc;
        background: transparent;
        text-align: right;
        display: inline-block;
        line-height: 24px;
    }
    .treasure-field {
        min-height: 80px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }
    .spellcasting-field {
        min-height: 120px;
        height: auto;
        border: 1px solid #444;
        padding: 4px;
        background: #fdfdfd;
        border-radius: 3px;
        box-sizing: border-box;
        overflow-wrap: break-word;
    }

}
 
/***** END NEW STAT BLOCKS ****/


/***** MORE INFO STYLES *****/
        
.ddb-statblock {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -10px
}

.ddb-statblock-item {
    -webkit-flex: 50%;
    -ms-flex: 50%;
    flex: 50%;
    padding: 10px
}

.scenes-panel-add-buttons-wrapper {
    display: flex;
    flex-direction: row;
    position: relative;
    padding-right: 6px;
    padding-left: 4px;
    justify-content: space-between;
    width: 100%;
}
@media(min-width: 475px) {
    .ddb-statblock-item {
        -webkit-flex:33.33333%;
        -ms-flex: 33.33333%;
        flex: 33.33333%
    }
}

@media(min-width: 600px) {
    .ddb-statblock-item {
        -webkit-flex:25%;
        -ms-flex: 25%;
        flex: 25%
    }
}

.ddb-statblock-item-label,.ddb-statblock-item-value {
    color: #242527;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.ddb-statblock-item-label {
    font-weight: bold;
    font-size: 14px;
    text-transform: uppercase
}

.ddb-statblock-item-value {
    font-size: 16px
}

.ddb-statblock-spell .ddb-statblock-item-value {
    text-overflow: initial;
    white-space: initial;
    overflow: initial
}

.ddb-statblock-ability-scores .ddb-statblock-item {
    text-align: center
}

@media(min-width: 420px) {
    .ddb-statblock-ability-scores .ddb-statblock-item {
        -webkit-flex:33.33333%;
        -ms-flex: 33.33333%;
        flex: 33.33333%
    }
}

@media(min-width: 740px) {
    .ddb-statblock-ability-scores .ddb-statblock-item {
        -webkit-flex:16.66667%;
        -ms-flex: 16.66667%;
        flex: 16.66667%
    }
}

.ddb-top-result .ddb-statblock-ability-scores .ddb-statblock-item {
    -webkit-flex: 33.33333%;
    -ms-flex: 33.33333%;
    flex: 33.33333%
}

.ddb-statblock-ability-scores .ddb-statblock-item-label::before {
    content: '';
    display: inline-block;
    height: 16px;
    width: 16px;
    background-size: cover;
    background-position: center
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.strength::before {
    background-image: url("../images/icons/abilities/strength.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.dexterity::before {
    background-image: url("../images/icons/abilities/dexterity.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.constitution::before {
    background-image: url("../images/icons/abilities/constitution.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.charisma::before {
    background-image: url("../images/icons/abilities/charisma.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.wisdom::before {
    background-image: url("../images/icons/abilities/wisdom.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-label.intelligence::before {
    background-image: url("../images/icons/abilities/intelligence.svg")
}

.ddb-statblock-ability-scores .ddb-statblock-item-value .score,.ddb-statblock-ability-scores .ddb-statblock-item-value .modifier {
    display: inline;
    font-size: 20px
}

.ddb-statblock-ability-scores .ddb-statblock-item-strength .score {
    color: #bf2225
}

.ddb-statblock-ability-scores .ddb-statblock-item-dexterity .score {
    color: #41474d
}

.ddb-statblock-ability-scores .ddb-statblock-item-constitution .score {
    color: #79614c
}

.ddb-statblock-ability-scores .ddb-statblock-item-intelligence .score {
    color: #f96a3b
}

.ddb-statblock-ability-scores .ddb-statblock-item-wisdom .score {
    color: #879399
}

.ddb-statblock-ability-scores .ddb-statblock-item-charisma .score {
    color: #edb451
}

.ddb-statblock-monster-stats .ddb-statblock-item {
    -webkit-flex: 1 1 50%;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%
}

@media(min-width: 640px) {
    .ddb-statblock-monster-stats .ddb-statblock-item {
        -webkit-flex-basis:25%;
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%
    }
}

.ddb-top-result .ddb-statblock-monster-stats .ddb-statblock-item {
    -webkit-flex: 50%;
    -ms-flex: 50%;
    flex: 50%
}

.ddb-statblock-monster-stats .ddb-statblock-item-label {
    text-align: center
}

.ddb-statblock-monster-stats .ddb-statblock-item-value {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.ddb-statblock-monster-stats .ddb-statblock-item-value .primary,.ddb-statblock-monster-stats .ddb-statblock-item-value .secondary {
    display: inline
}

.ddb-statblock-monster-stats .ddb-statblock-item-value .primary {
    font-size: 24px;
    padding-right: 3px
}

.ddb-statblock-monster-stats .ddb-statblock-item-value .secondary {
    font-size: 12px;
    font-weight: 500;
    white-space: normal
}

.ddb-top-result .ddb-statblock-monster-info .ddb-statblock-item {
    -webkit-flex: 50%;
    -ms-flex: 50%;
    flex: 50%
}

.ddb-statblock-monster-info .ddb-statblock-item-value {
    font-size: 14px;
    text-overflow: initial;
    white-space: initial;
    overflow: initial
}

.tooltip-header-title{
    text-transform: capitalize;
}

.line {
    width: 100%;
    height: 1px;
    background-color: #1b9af0
}

.line.height3 {
    height: 3px
}

.line.height2 {
    height: 2px
}

.line.marginBottom10 {
    margin-bottom: 10px
}

.line.marginBottom20,.line.marginbottom20 {
    margin-bottom: 20px
}

.line.marginBottom30 {
    margin-bottom: 30px
}

.line.marginTop20 {
    margin-top: 20px
}

.line.marginTop15 {
    margin-top: 15px
}

.line.marginTop10 {
    margin-top: 10px
}

.line.character {
    background-color: #ee8600
}

.line.rule,.line.compendium {
    background-color: #47D18C
}

.line.item,.line.magic-item,.line.gear {
    background-color: #0f5cbc
}

.line.monster {
    background-color: #bc0f0f
}

.line.spell {
    background-color: #704cd9
}

.line.forum {
    background-color: #979aa4
}

.line.grey {
    background-color: #979AA4
}

.line.vehicle {
    background-color: #4599E9
}

.line.muted {
    background-color: #EDEAE8
}


.more-info,.RPGMonster-listing .more-info,.RPGMagicItem-listing .more-info,.ihomebrewable-listing .more-info,.RPGSpell-listing .more-info,.IGear-listing .more-info,.RPGFeat-listing .more-info,.RPGBackground-listing .more-info,.RPGSubclass-listing .more-info {
    position: relative;
    top: -10px !important;
    background-color: #fff !important;
    border: none;
    width: calc(100% - 2px) !important;
    margin: 0 auto;
    padding: 5px 5px 0 !important;
}



 .more-info-body-description,.RPGMonster-listing .more-info-body-description,.RPGMagicItem-listing .more-info-body-description,.ihomebrewable-listing .more-info-body-description,.RPGSpell-listing .more-info-body-description,.IGear-listing .more-info-body-description,.RPGFeat-listing .more-info-body-description,.RPGBackground-listing .more-info-body-description,.RPGSubclass-listing .more-info-body-description {
    font-size: 14px;
    line-height: 24px;
    color: #242527
}

 .more-info-body-description table,.RPGMonster-listing .more-info-body-description table,.RPGMagicItem-listing .more-info-body-description table,.ihomebrewable-listing .more-info-body-description table,.RPGSpell-listing .more-info-body-description table,.IGear-listing .more-info-body-description table,.RPGFeat-listing .more-info-body-description table,.RPGBackground-listing .more-info-body-description table,.RPGSubclass-listing .more-info-body-description table {
    border-collapse: collapse;
    margin: 20px 0
}

 .more-info-body-description table.compendium-left-aligned-table th,.RPGMonster-listing .more-info-body-description table.compendium-left-aligned-table th,.RPGMagicItem-listing .more-info-body-description table.compendium-left-aligned-table th,.ihomebrewable-listing .more-info-body-description table.compendium-left-aligned-table th,.RPGSpell-listing .more-info-body-description table.compendium-left-aligned-table th,.IGear-listing .more-info-body-description table.compendium-left-aligned-table th,.RPGFeat-listing .more-info-body-description table.compendium-left-aligned-table th,.RPGBackground-listing .more-info-body-description table.compendium-left-aligned-table th,.RPGSubclass-listing .more-info-body-description table.compendium-left-aligned-table th {
    text-align: left
}

 .more-info-body-description table, .more-info-body-description table th, .more-info-body-description table td,.RPGMonster-listing .more-info-body-description table,.RPGMonster-listing .more-info-body-description table th,.RPGMonster-listing .more-info-body-description table td,.RPGMagicItem-listing .more-info-body-description table,.RPGMagicItem-listing .more-info-body-description table th,.RPGMagicItem-listing .more-info-body-description table td,.ihomebrewable-listing .more-info-body-description table,.ihomebrewable-listing .more-info-body-description table th,.ihomebrewable-listing .more-info-body-description table td,.RPGSpell-listing .more-info-body-description table,.RPGSpell-listing .more-info-body-description table th,.RPGSpell-listing .more-info-body-description table td,.IGear-listing .more-info-body-description table,.IGear-listing .more-info-body-description table th,.IGear-listing .more-info-body-description table td,.RPGFeat-listing .more-info-body-description table,.RPGFeat-listing .more-info-body-description table th,.RPGFeat-listing .more-info-body-description table td,.RPGBackground-listing .more-info-body-description table,.RPGBackground-listing .more-info-body-description table th,.RPGBackground-listing .more-info-body-description table td,.RPGSubclass-listing .more-info-body-description table,.RPGSubclass-listing .more-info-body-description table th,.RPGSubclass-listing .more-info-body-description table td {
    border: 1px solid #edeae8
}

 .more-info-body-description table th, .more-info-body-description table td,.RPGMonster-listing .more-info-body-description table th,.RPGMonster-listing .more-info-body-description table td,.RPGMagicItem-listing .more-info-body-description table th,.RPGMagicItem-listing .more-info-body-description table td,.ihomebrewable-listing .more-info-body-description table th,.ihomebrewable-listing .more-info-body-description table td,.RPGSpell-listing .more-info-body-description table th,.RPGSpell-listing .more-info-body-description table td,.IGear-listing .more-info-body-description table th,.IGear-listing .more-info-body-description table td,.RPGFeat-listing .more-info-body-description table th,.RPGFeat-listing .more-info-body-description table td,.RPGBackground-listing .more-info-body-description table th,.RPGBackground-listing .more-info-body-description table td,.RPGSubclass-listing .more-info-body-description table th,.RPGSubclass-listing .more-info-body-description table td {
    font-size: 14px
}

 .more-info-body-description table th.left-align, .more-info-body-description table td.left-align,.RPGMonster-listing .more-info-body-description table th.left-align,.RPGMonster-listing .more-info-body-description table td.left-align,.RPGMagicItem-listing .more-info-body-description table th.left-align,.RPGMagicItem-listing .more-info-body-description table td.left-align,.ihomebrewable-listing .more-info-body-description table th.left-align,.ihomebrewable-listing .more-info-body-description table td.left-align,.RPGSpell-listing .more-info-body-description table th.left-align,.RPGSpell-listing .more-info-body-description table td.left-align,.IGear-listing .more-info-body-description table th.left-align,.IGear-listing .more-info-body-description table td.left-align,.RPGFeat-listing .more-info-body-description table th.left-align,.RPGFeat-listing .more-info-body-description table td.left-align,.RPGBackground-listing .more-info-body-description table th.left-align,.RPGBackground-listing .more-info-body-description table td.left-align,.RPGSubclass-listing .more-info-body-description table th.left-align,.RPGSubclass-listing .more-info-body-description table td.left-align {
    text-align: left!important
}

 .more-info-body-description table th.uppercase, .more-info-body-description table td.uppercase,.RPGMonster-listing .more-info-body-description table th.uppercase,.RPGMonster-listing .more-info-body-description table td.uppercase,.RPGMagicItem-listing .more-info-body-description table th.uppercase,.RPGMagicItem-listing .more-info-body-description table td.uppercase,.ihomebrewable-listing .more-info-body-description table th.uppercase,.ihomebrewable-listing .more-info-body-description table td.uppercase,.RPGSpell-listing .more-info-body-description table th.uppercase,.RPGSpell-listing .more-info-body-description table td.uppercase,.IGear-listing .more-info-body-description table th.uppercase,.IGear-listing .more-info-body-description table td.uppercase,.RPGFeat-listing .more-info-body-description table th.uppercase,.RPGFeat-listing .more-info-body-description table td.uppercase,.RPGBackground-listing .more-info-body-description table th.uppercase,.RPGBackground-listing .more-info-body-description table td.uppercase,.RPGSubclass-listing .more-info-body-description table th.uppercase,.RPGSubclass-listing .more-info-body-description table td.uppercase {
    text-transform: uppercase!important
}

 .more-info-body-description table td,.RPGMonster-listing .more-info-body-description table td,.RPGMagicItem-listing .more-info-body-description table td,.ihomebrewable-listing .more-info-body-description table td,.RPGSpell-listing .more-info-body-description table td,.IGear-listing .more-info-body-description table td,.RPGFeat-listing .more-info-body-description table td,.RPGBackground-listing .more-info-body-description table td,.RPGSubclass-listing .more-info-body-description table td {
    text-align: center;
    padding: 10px 20px;
    overflow-wrap: break-word
}

 .more-info-body-description table td p,.RPGMonster-listing .more-info-body-description table td p,.RPGMagicItem-listing .more-info-body-description table td p,.ihomebrewable-listing .more-info-body-description table td p,.RPGSpell-listing .more-info-body-description table td p,.IGear-listing .more-info-body-description table td p,.RPGFeat-listing .more-info-body-description table td p,.RPGBackground-listing .more-info-body-description table td p,.RPGSubclass-listing .more-info-body-description table td p {
    font-size: 14px
}

 .more-info-body-description table thead th,.RPGMonster-listing .more-info-body-description table thead th,.RPGMagicItem-listing .more-info-body-description table thead th,.ihomebrewable-listing .more-info-body-description table thead th,.RPGSpell-listing .more-info-body-description table thead th,.IGear-listing .more-info-body-description table thead th,.RPGFeat-listing .more-info-body-description table thead th,.RPGBackground-listing .more-info-body-description table thead th,.RPGSubclass-listing .more-info-body-description table thead th {
    font-size: 14px;
    font-weight: bold;
    padding: 10px 20px;
    border-bottom: 2px solid #d0cac5;
    text-align: center;
    background: #fff;
    color: #242527
}

 .more-info-body-description table tbody tr,.RPGMonster-listing .more-info-body-description table tbody tr,.RPGMagicItem-listing .more-info-body-description table tbody tr,.ihomebrewable-listing .more-info-body-description table tbody tr,.RPGSpell-listing .more-info-body-description table tbody tr,.IGear-listing .more-info-body-description table tbody tr,.RPGFeat-listing .more-info-body-description table tbody tr,.RPGBackground-listing .more-info-body-description table tbody tr,.RPGSubclass-listing .more-info-body-description table tbody tr {
    background: #fff
}

 .more-info-body-description table tbody tr td,.RPGMonster-listing .more-info-body-description table tbody tr td,.RPGMagicItem-listing .more-info-body-description table tbody tr td,.ihomebrewable-listing .more-info-body-description table tbody tr td,.RPGSpell-listing .more-info-body-description table tbody tr td,.IGear-listing .more-info-body-description table tbody tr td,.RPGFeat-listing .more-info-body-description table tbody tr td,.RPGBackground-listing .more-info-body-description table tbody tr td,.RPGSubclass-listing .more-info-body-description table tbody tr td {
    min-width: 100px;
    padding: 20px;
    background: 0;
    max-width: 400px
}

 .more-info-body-description table tbody tr td.left-align,.RPGMonster-listing .more-info-body-description table tbody tr td.left-align,.RPGMagicItem-listing .more-info-body-description table tbody tr td.left-align,.ihomebrewable-listing .more-info-body-description table tbody tr td.left-align,.RPGSpell-listing .more-info-body-description table tbody tr td.left-align,.IGear-listing .more-info-body-description table tbody tr td.left-align,.RPGFeat-listing .more-info-body-description table tbody tr td.left-align,.RPGBackground-listing .more-info-body-description table tbody tr td.left-align,.RPGSubclass-listing .more-info-body-description table tbody tr td.left-align {
    text-align: left!important
}

 .more-info-body-description table tbody tr td.uppercase,.RPGMonster-listing .more-info-body-description table tbody tr td.uppercase,.RPGMagicItem-listing .more-info-body-description table tbody tr td.uppercase,.ihomebrewable-listing .more-info-body-description table tbody tr td.uppercase,.RPGSpell-listing .more-info-body-description table tbody tr td.uppercase,.IGear-listing .more-info-body-description table tbody tr td.uppercase,.RPGFeat-listing .more-info-body-description table tbody tr td.uppercase,.RPGBackground-listing .more-info-body-description table tbody tr td.uppercase,.RPGSubclass-listing .more-info-body-description table tbody tr td.uppercase {
    text-transform: uppercase!important
}

 .more-info-body-description table tbody tr:nth-child(odd),.RPGMonster-listing .more-info-body-description table tbody tr:nth-child(odd),.RPGMagicItem-listing .more-info-body-description table tbody tr:nth-child(odd),.ihomebrewable-listing .more-info-body-description table tbody tr:nth-child(odd),.RPGSpell-listing .more-info-body-description table tbody tr:nth-child(odd),.IGear-listing .more-info-body-description table tbody tr:nth-child(odd),.RPGFeat-listing .more-info-body-description table tbody tr:nth-child(odd),.RPGBackground-listing .more-info-body-description table tbody tr:nth-child(odd),.RPGSubclass-listing .more-info-body-description table tbody tr:nth-child(odd) {
    background: #faf8f7
}

 .more-info-body-description ul,.RPGMonster-listing .more-info-body-description ul,.RPGMagicItem-listing .more-info-body-description ul,.ihomebrewable-listing .more-info-body-description ul,.RPGSpell-listing .more-info-body-description ul,.IGear-listing .more-info-body-description ul,.RPGFeat-listing .more-info-body-description ul,.RPGBackground-listing .more-info-body-description ul,.RPGSubclass-listing .more-info-body-description ul {
    list-style: initial;
    padding: 15px
}

 .more-info-body-description ol,.RPGMonster-listing .more-info-body-description ol,.RPGMagicItem-listing .more-info-body-description ol,.ihomebrewable-listing .more-info-body-description ol,.RPGSpell-listing .more-info-body-description ol,.IGear-listing .more-info-body-description ol,.RPGFeat-listing .more-info-body-description ol,.RPGBackground-listing .more-info-body-description ol,.RPGSubclass-listing .more-info-body-description ol {
    list-style: decimal;
    padding: 15px
}

 .more-info-body-description blockquote,.RPGMonster-listing .more-info-body-description blockquote,.RPGMagicItem-listing .more-info-body-description blockquote,.ihomebrewable-listing .more-info-body-description blockquote,.RPGSpell-listing .more-info-body-description blockquote,.IGear-listing .more-info-body-description blockquote,.RPGFeat-listing .more-info-body-description blockquote,.RPGBackground-listing .more-info-body-description blockquote,.RPGSubclass-listing .more-info-body-description blockquote {
    font-size: 14px;
    margin: 5px 0
}

 .more-info-body-description blockquote p,.RPGMonster-listing .more-info-body-description blockquote p,.RPGMagicItem-listing .more-info-body-description blockquote p,.ihomebrewable-listing .more-info-body-description blockquote p,.RPGSpell-listing .more-info-body-description blockquote p,.IGear-listing .more-info-body-description blockquote p,.RPGFeat-listing .more-info-body-description blockquote p,.RPGBackground-listing .more-info-body-description blockquote p,.RPGSubclass-listing .more-info-body-description blockquote p {
    font-size: 14px
}

 .more-info-body-description h1, .more-info-body-description h2, .more-info-body-description h3,.RPGMonster-listing .more-info-body-description h1,.RPGMonster-listing .more-info-body-description h2,.RPGMonster-listing .more-info-body-description h3,.RPGMagicItem-listing .more-info-body-description h1,.RPGMagicItem-listing .more-info-body-description h2,.RPGMagicItem-listing .more-info-body-description h3,.ihomebrewable-listing .more-info-body-description h1,.ihomebrewable-listing .more-info-body-description h2,.ihomebrewable-listing .more-info-body-description h3,.RPGSpell-listing .more-info-body-description h1,.RPGSpell-listing .more-info-body-description h2,.RPGSpell-listing .more-info-body-description h3,.IGear-listing .more-info-body-description h1,.IGear-listing .more-info-body-description h2,.IGear-listing .more-info-body-description h3,.RPGFeat-listing .more-info-body-description h1,.RPGFeat-listing .more-info-body-description h2,.RPGFeat-listing .more-info-body-description h3,.RPGBackground-listing .more-info-body-description h1,.RPGBackground-listing .more-info-body-description h2,.RPGBackground-listing .more-info-body-description h3,.RPGSubclass-listing .more-info-body-description h1,.RPGSubclass-listing .more-info-body-description h2,.RPGSubclass-listing .more-info-body-description h3 {
    font-weight: normal
}

 .more-info-body-description h1,.RPGMonster-listing .more-info-body-description h1,.RPGMagicItem-listing .more-info-body-description h1,.ihomebrewable-listing .more-info-body-description h1,.RPGSpell-listing .more-info-body-description h1,.IGear-listing .more-info-body-description h1,.RPGFeat-listing .more-info-body-description h1,.RPGBackground-listing .more-info-body-description h1,.RPGSubclass-listing .more-info-body-description h1 {
    font-size: 32px
}

 .more-info-body-description h2,.RPGMonster-listing .more-info-body-description h2,.RPGMagicItem-listing .more-info-body-description h2,.ihomebrewable-listing .more-info-body-description h2,.RPGSpell-listing .more-info-body-description h2,.IGear-listing .more-info-body-description h2,.RPGFeat-listing .more-info-body-description h2,.RPGBackground-listing .more-info-body-description h2,.RPGSubclass-listing .more-info-body-description h2 {
    font-size: 26px
}

 .more-info-body-description h3,.RPGMonster-listing .more-info-body-description h3,.RPGMagicItem-listing .more-info-body-description h3,.ihomebrewable-listing .more-info-body-description h3,.RPGSpell-listing .more-info-body-description h3,.IGear-listing .more-info-body-description h3,.RPGFeat-listing .more-info-body-description h3,.RPGBackground-listing .more-info-body-description h3,.RPGSubclass-listing .more-info-body-description h3 {
    font-size: 20px
}

 .more-info-body-description h5, .more-info-body-description h6,.RPGMonster-listing .more-info-body-description h5,.RPGMonster-listing .more-info-body-description h6,.RPGMagicItem-listing .more-info-body-description h5,.RPGMagicItem-listing .more-info-body-description h6,.ihomebrewable-listing .more-info-body-description h5,.ihomebrewable-listing .more-info-body-description h6,.RPGSpell-listing .more-info-body-description h5,.RPGSpell-listing .more-info-body-description h6,.IGear-listing .more-info-body-description h5,.IGear-listing .more-info-body-description h6,.RPGFeat-listing .more-info-body-description h5,.RPGFeat-listing .more-info-body-description h6,.RPGBackground-listing .more-info-body-description h5,.RPGBackground-listing .more-info-body-description h6,.RPGSubclass-listing .more-info-body-description h5,.RPGSubclass-listing .more-info-body-description h6 {
    font-size: 18px
}

 .more-info-body-description a,.RPGMonster-listing .more-info-body-description a,.RPGMagicItem-listing .more-info-body-description a,.ihomebrewable-listing .more-info-body-description a,.RPGSpell-listing .more-info-body-description a,.IGear-listing .more-info-body-description a,.RPGFeat-listing .more-info-body-description a,.RPGBackground-listing .more-info-body-description a,.RPGSubclass-listing .more-info-body-description a {
    text-decoration: none;
    cursor: pointer
}

 .more-info-body-description a, .more-info-body-description a:hover, .more-info-body-description a:focus, .more-info-body-description a:active, .more-info-body-description a:visited,.RPGMonster-listing .more-info-body-description a,.RPGMonster-listing .more-info-body-description a:hover,.RPGMonster-listing .more-info-body-description a:focus,.RPGMonster-listing .more-info-body-description a:active,.RPGMonster-listing .more-info-body-description a:visited,.RPGMagicItem-listing .more-info-body-description a,.RPGMagicItem-listing .more-info-body-description a:hover,.RPGMagicItem-listing .more-info-body-description a:focus,.RPGMagicItem-listing .more-info-body-description a:active,.RPGMagicItem-listing .more-info-body-description a:visited,.ihomebrewable-listing .more-info-body-description a,.ihomebrewable-listing .more-info-body-description a:hover,.ihomebrewable-listing .more-info-body-description a:focus,.ihomebrewable-listing .more-info-body-description a:active,.ihomebrewable-listing .more-info-body-description a:visited,.RPGSpell-listing .more-info-body-description a,.RPGSpell-listing .more-info-body-description a:hover,.RPGSpell-listing .more-info-body-description a:focus,.RPGSpell-listing .more-info-body-description a:active,.RPGSpell-listing .more-info-body-description a:visited,.IGear-listing .more-info-body-description a,.IGear-listing .more-info-body-description a:hover,.IGear-listing .more-info-body-description a:focus,.IGear-listing .more-info-body-description a:active,.IGear-listing .more-info-body-description a:visited,.RPGFeat-listing .more-info-body-description a,.RPGFeat-listing .more-info-body-description a:hover,.RPGFeat-listing .more-info-body-description a:focus,.RPGFeat-listing .more-info-body-description a:active,.RPGFeat-listing .more-info-body-description a:visited,.RPGBackground-listing .more-info-body-description a,.RPGBackground-listing .more-info-body-description a:hover,.RPGBackground-listing .more-info-body-description a:focus,.RPGBackground-listing .more-info-body-description a:active,.RPGBackground-listing .more-info-body-description a:visited,.RPGSubclass-listing .more-info-body-description a,.RPGSubclass-listing .more-info-body-description a:hover,.RPGSubclass-listing .more-info-body-description a:focus,.RPGSubclass-listing .more-info-body-description a:active,.RPGSubclass-listing .more-info-body-description a:visited {
    color: #47D18C
}

 .more-info-body-description h1, .more-info-body-description h2, .more-info-body-description h3,.RPGMonster-listing .more-info-body-description h1,.RPGMonster-listing .more-info-body-description h2,.RPGMonster-listing .more-info-body-description h3,.RPGMagicItem-listing .more-info-body-description h1,.RPGMagicItem-listing .more-info-body-description h2,.RPGMagicItem-listing .more-info-body-description h3,.ihomebrewable-listing .more-info-body-description h1,.ihomebrewable-listing .more-info-body-description h2,.ihomebrewable-listing .more-info-body-description h3,.RPGSpell-listing .more-info-body-description h1,.RPGSpell-listing .more-info-body-description h2,.RPGSpell-listing .more-info-body-description h3,.IGear-listing .more-info-body-description h1,.IGear-listing .more-info-body-description h2,.IGear-listing .more-info-body-description h3,.RPGFeat-listing .more-info-body-description h1,.RPGFeat-listing .more-info-body-description h2,.RPGFeat-listing .more-info-body-description h3,.RPGBackground-listing .more-info-body-description h1,.RPGBackground-listing .more-info-body-description h2,.RPGBackground-listing .more-info-body-description h3,.RPGSubclass-listing .more-info-body-description h1,.RPGSubclass-listing .more-info-body-description h2,.RPGSubclass-listing .more-info-body-description h3 {
    font-weight: normal
}

 .more-info-body-description h1,.RPGMonster-listing .more-info-body-description h1,.RPGMagicItem-listing .more-info-body-description h1,.ihomebrewable-listing .more-info-body-description h1,.RPGSpell-listing .more-info-body-description h1,.IGear-listing .more-info-body-description h1,.RPGFeat-listing .more-info-body-description h1,.RPGBackground-listing .more-info-body-description h1,.RPGSubclass-listing .more-info-body-description h1 {
    font-size: 32px
}

 .more-info-body-description h1::after,.RPGMonster-listing .more-info-body-description h1::after,.RPGMagicItem-listing .more-info-body-description h1::after,.ihomebrewable-listing .more-info-body-description h1::after,.RPGSpell-listing .more-info-body-description h1::after,.IGear-listing .more-info-body-description h1::after,.RPGFeat-listing .more-info-body-description h1::after,.RPGBackground-listing .more-info-body-description h1::after,.RPGSubclass-listing .more-info-body-description h1::after {
    content: '';
    width: 100%;
    max-width: 1200px;
    margin: 5px auto 20px;
    height: 3px;
    background-color: #1b9af0;
    display: block
}

 .more-info-body-description h2::after, .more-info-body-description h3::after,.RPGMonster-listing .more-info-body-description h2::after,.RPGMonster-listing .more-info-body-description h3::after,.RPGMagicItem-listing .more-info-body-description h2::after,.RPGMagicItem-listing .more-info-body-description h3::after,.ihomebrewable-listing .more-info-body-description h2::after,.ihomebrewable-listing .more-info-body-description h3::after,.RPGSpell-listing .more-info-body-description h2::after,.RPGSpell-listing .more-info-body-description h3::after,.IGear-listing .more-info-body-description h2::after,.IGear-listing .more-info-body-description h3::after,.RPGFeat-listing .more-info-body-description h2::after,.RPGFeat-listing .more-info-body-description h3::after,.RPGBackground-listing .more-info-body-description h2::after,.RPGBackground-listing .more-info-body-description h3::after,.RPGSubclass-listing .more-info-body-description h2::after,.RPGSubclass-listing .more-info-body-description h3::after {
    content: '';
    width: 100%;
    margin: 5px auto 20px;
    height: 1px;
    background-color: #1b9af0;
    display: block
}

 .more-info-body-description h2,.RPGMonster-listing .more-info-body-description h2,.RPGMagicItem-listing .more-info-body-description h2,.ihomebrewable-listing .more-info-body-description h2,.RPGSpell-listing .more-info-body-description h2,.IGear-listing .more-info-body-description h2,.RPGFeat-listing .more-info-body-description h2,.RPGBackground-listing .more-info-body-description h2,.RPGSubclass-listing .more-info-body-description h2 {
    font-size: 26px
}

 .more-info-body-description h3,.RPGMonster-listing .more-info-body-description h3,.RPGMagicItem-listing .more-info-body-description h3,.ihomebrewable-listing .more-info-body-description h3,.RPGSpell-listing .more-info-body-description h3,.IGear-listing .more-info-body-description h3,.RPGFeat-listing .more-info-body-description h3,.RPGBackground-listing .more-info-body-description h3,.RPGSubclass-listing .more-info-body-description h3 {
    font-size: 20px
}

 .more-info-body-description h5, .more-info-body-description h6,.RPGMonster-listing .more-info-body-description h5,.RPGMonster-listing .more-info-body-description h6,.RPGMagicItem-listing .more-info-body-description h5,.RPGMagicItem-listing .more-info-body-description h6,.ihomebrewable-listing .more-info-body-description h5,.ihomebrewable-listing .more-info-body-description h6,.RPGSpell-listing .more-info-body-description h5,.RPGSpell-listing .more-info-body-description h6,.IGear-listing .more-info-body-description h5,.IGear-listing .more-info-body-description h6,.RPGFeat-listing .more-info-body-description h5,.RPGFeat-listing .more-info-body-description h6,.RPGBackground-listing .more-info-body-description h5,.RPGBackground-listing .more-info-body-description h6,.RPGSubclass-listing .more-info-body-description h5,.RPGSubclass-listing .more-info-body-description h6 {
    font-size: 18px
}

 .more-info-body-description-upper,.RPGMonster-listing .more-info-body-description-upper,.RPGMagicItem-listing .more-info-body-description-upper,.ihomebrewable-listing .more-info-body-description-upper,.RPGSpell-listing .more-info-body-description-upper,.IGear-listing .more-info-body-description-upper,.RPGFeat-listing .more-info-body-description-upper,.RPGBackground-listing .more-info-body-description-upper,.RPGSubclass-listing .more-info-body-description-upper {
    font-style: italic;
    font-size: 16px
}

 .more-info-body-description-lower,.RPGMonster-listing .more-info-body-description-lower,.RPGMagicItem-listing .more-info-body-description-lower,.ihomebrewable-listing .more-info-body-description-lower,.RPGSpell-listing .more-info-body-description-lower,.IGear-listing .more-info-body-description-lower,.RPGFeat-listing .more-info-body-description-lower,.RPGBackground-listing .more-info-body-description-lower,.RPGSubclass-listing .more-info-body-description-lower {
    padding-top: 20px
}

 .more-info-body-description-lower .more-info-notes,.RPGMonster-listing .more-info-body-description-lower .more-info-notes,.RPGMagicItem-listing .more-info-body-description-lower .more-info-notes,.ihomebrewable-listing .more-info-body-description-lower .more-info-notes,.RPGSpell-listing .more-info-body-description-lower .more-info-notes,.IGear-listing .more-info-body-description-lower .more-info-notes,.RPGFeat-listing .more-info-body-description-lower .more-info-notes,.RPGBackground-listing .more-info-body-description-lower .more-info-notes,.RPGSubclass-listing .more-info-body-description-lower .more-info-notes {
    font-style: italic
}

 .more-info-body-description h4,.RPGMonster-listing .more-info-body-description h4,.RPGMagicItem-listing .more-info-body-description h4,.ihomebrewable-listing .more-info-body-description h4,.RPGSpell-listing .more-info-body-description h4,.IGear-listing .more-info-body-description h4,.RPGFeat-listing .more-info-body-description h4,.RPGBackground-listing .more-info-body-description h4,.RPGSubclass-listing .more-info-body-description h4 {
    font-size: 20px
}

 .more-info-body-description h5,.RPGMonster-listing .more-info-body-description h5,.RPGMagicItem-listing .more-info-body-description h5,.ihomebrewable-listing .more-info-body-description h5,.RPGSpell-listing .more-info-body-description h5,.IGear-listing .more-info-body-description h5,.RPGFeat-listing .more-info-body-description h5,.RPGBackground-listing .more-info-body-description h5,.RPGSubclass-listing .more-info-body-description h5 {
    font-size: 16px
}

 .more-info-monster .more-info-body-description h1::after, .more-info-monster .more-info-body-description h2::before, .more-info-monster .more-info-body-description h3::before,.RPGMonster-listing .more-info-monster .more-info-body-description h1::after,.RPGMonster-listing .more-info-monster .more-info-body-description h2::before,.RPGMonster-listing .more-info-monster .more-info-body-description h3::before,.RPGMagicItem-listing .more-info-monster .more-info-body-description h1::after,.RPGMagicItem-listing .more-info-monster .more-info-body-description h2::before,.RPGMagicItem-listing .more-info-monster .more-info-body-description h3::before,.ihomebrewable-listing .more-info-monster .more-info-body-description h1::after,.ihomebrewable-listing .more-info-monster .more-info-body-description h2::before,.ihomebrewable-listing .more-info-monster .more-info-body-description h3::before,.RPGSpell-listing .more-info-monster .more-info-body-description h1::after,.RPGSpell-listing .more-info-monster .more-info-body-description h2::before,.RPGSpell-listing .more-info-monster .more-info-body-description h3::before,.IGear-listing .more-info-monster .more-info-body-description h1::after,.IGear-listing .more-info-monster .more-info-body-description h2::before,.IGear-listing .more-info-monster .more-info-body-description h3::before,.RPGFeat-listing .more-info-monster .more-info-body-description h1::after,.RPGFeat-listing .more-info-monster .more-info-body-description h2::before,.RPGFeat-listing .more-info-monster .more-info-body-description h3::before,.RPGBackground-listing .more-info-monster .more-info-body-description h1::after,.RPGBackground-listing .more-info-monster .more-info-body-description h2::before,.RPGBackground-listing .more-info-monster .more-info-body-description h3::before,.RPGSubclass-listing .more-info-monster .more-info-body-description h1::after,.RPGSubclass-listing .more-info-monster .more-info-body-description h2::before,.RPGSubclass-listing .more-info-monster .more-info-body-description h3::before {
    content: none
}

 .more-info-footer,.RPGMonster-listing .more-info-footer,.RPGMagicItem-listing .more-info-footer,.ihomebrewable-listing .more-info-footer,.RPGSpell-listing .more-info-footer,.IGear-listing .more-info-footer,.RPGFeat-listing .more-info-footer,.RPGBackground-listing .more-info-footer,.RPGSubclass-listing .more-info-footer {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 20px
}

@media(min-width: 1024px) {
     .more-info-footer,.RPGMonster-listing .more-info-footer,.RPGMagicItem-listing .more-info-footer,.ihomebrewable-listing .more-info-footer,.RPGSpell-listing .more-info-footer,.IGear-listing .more-info-footer,.RPGFeat-listing .more-info-footer,.RPGBackground-listing .more-info-footer,.RPGSubclass-listing .more-info-footer {
        -webkit-justify-content:flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

 .more-info-footer-details-button,.RPGMonster-listing .more-info-footer-details-button,.RPGMagicItem-listing .more-info-footer-details-button,.ihomebrewable-listing .more-info-footer-details-button,.RPGSpell-listing .more-info-footer-details-button,.IGear-listing .more-info-footer-details-button,.RPGFeat-listing .more-info-footer-details-button,.RPGBackground-listing .more-info-footer-details-button,.RPGSubclass-listing .more-info-footer-details-button {
    margin: 0 auto;
    padding: 10px 0;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1
}

@media(min-width: 1024px) {
     .more-info-footer-details-button,.RPGMonster-listing .more-info-footer-details-button,.RPGMagicItem-listing .more-info-footer-details-button,.ihomebrewable-listing .more-info-footer-details-button,.RPGSpell-listing .more-info-footer-details-button,.IGear-listing .more-info-footer-details-button,.RPGFeat-listing .more-info-footer-details-button,.RPGBackground-listing .more-info-footer-details-button,.RPGSubclass-listing .more-info-footer-details-button {
        -webkit-order:unset;
        -ms-flex-order: unset;
        order: unset;
        margin-left: 0;
        margin-right: 10px
    }
}

 .more-info-footer-details-button .button-characters,.RPGMonster-listing .more-info-footer-details-button .button-characters,.RPGMagicItem-listing .more-info-footer-details-button .button-characters,.ihomebrewable-listing .more-info-footer-details-button .button-characters,.RPGSpell-listing .more-info-footer-details-button .button-characters,.IGear-listing .more-info-footer-details-button .button-characters,.RPGFeat-listing .more-info-footer-details-button .button-characters,.RPGBackground-listing .more-info-footer-details-button .button-characters,.RPGSubclass-listing .more-info-footer-details-button .button-characters {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 16px;
    background: #ee8600;
    height: 50px;
    width: 100%;
    max-width: 300px;
    min-width: 250px;
    box-shadow: none;
    border: 0;
    transition: 100ms linear all;
    text-transform: uppercase;
    text-shadow: none
}

 .more-info-footer-details-button .button-characters:hover,.RPGMonster-listing .more-info-footer-details-button .button-characters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-characters:hover,.RPGSpell-listing .more-info-footer-details-button .button-characters:hover,.IGear-listing .more-info-footer-details-button .button-characters:hover,.RPGFeat-listing .more-info-footer-details-button .button-characters:hover,.RPGBackground-listing .more-info-footer-details-button .button-characters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-characters:hover {
    background: #ff9e22
}

 .more-info-footer-details-button .button-characters, .more-info-footer-details-button .button-characters:hover, .more-info-footer-details-button .button-characters:focus, .more-info-footer-details-button .button-characters:active, .more-info-footer-details-button .button-characters:visited,.RPGMonster-listing .more-info-footer-details-button .button-characters,.RPGMonster-listing .more-info-footer-details-button .button-characters:hover,.RPGMonster-listing .more-info-footer-details-button .button-characters:focus,.RPGMonster-listing .more-info-footer-details-button .button-characters:active,.RPGMonster-listing .more-info-footer-details-button .button-characters:visited,.RPGMagicItem-listing .more-info-footer-details-button .button-characters,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:focus,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:active,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:visited,.ihomebrewable-listing .more-info-footer-details-button .button-characters,.ihomebrewable-listing .more-info-footer-details-button .button-characters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-characters:focus,.ihomebrewable-listing .more-info-footer-details-button .button-characters:active,.ihomebrewable-listing .more-info-footer-details-button .button-characters:visited,.RPGSpell-listing .more-info-footer-details-button .button-characters,.RPGSpell-listing .more-info-footer-details-button .button-characters:hover,.RPGSpell-listing .more-info-footer-details-button .button-characters:focus,.RPGSpell-listing .more-info-footer-details-button .button-characters:active,.RPGSpell-listing .more-info-footer-details-button .button-characters:visited,.IGear-listing .more-info-footer-details-button .button-characters,.IGear-listing .more-info-footer-details-button .button-characters:hover,.IGear-listing .more-info-footer-details-button .button-characters:focus,.IGear-listing .more-info-footer-details-button .button-characters:active,.IGear-listing .more-info-footer-details-button .button-characters:visited,.RPGFeat-listing .more-info-footer-details-button .button-characters,.RPGFeat-listing .more-info-footer-details-button .button-characters:hover,.RPGFeat-listing .more-info-footer-details-button .button-characters:focus,.RPGFeat-listing .more-info-footer-details-button .button-characters:active,.RPGFeat-listing .more-info-footer-details-button .button-characters:visited,.RPGBackground-listing .more-info-footer-details-button .button-characters,.RPGBackground-listing .more-info-footer-details-button .button-characters:hover,.RPGBackground-listing .more-info-footer-details-button .button-characters:focus,.RPGBackground-listing .more-info-footer-details-button .button-characters:active,.RPGBackground-listing .more-info-footer-details-button .button-characters:visited,.RPGSubclass-listing .more-info-footer-details-button .button-characters,.RPGSubclass-listing .more-info-footer-details-button .button-characters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-characters:focus,.RPGSubclass-listing .more-info-footer-details-button .button-characters:active,.RPGSubclass-listing .more-info-footer-details-button .button-characters:visited {
    color: #fff
}

@media(min-width: 1024px) {
     .more-info-footer-details-button .button-characters,.RPGMonster-listing .more-info-footer-details-button .button-characters,.RPGMagicItem-listing .more-info-footer-details-button .button-characters,.ihomebrewable-listing .more-info-footer-details-button .button-characters,.RPGSpell-listing .more-info-footer-details-button .button-characters,.IGear-listing .more-info-footer-details-button .button-characters,.RPGFeat-listing .more-info-footer-details-button .button-characters,.RPGBackground-listing .more-info-footer-details-button .button-characters,.RPGSubclass-listing .more-info-footer-details-button .button-characters {
        height:35px;
        font-size: 12px;
        min-width: 180px
    }
}

 .more-info-footer-details-button .button-characters:hover,.RPGMonster-listing .more-info-footer-details-button .button-characters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-characters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-characters:hover,.RPGSpell-listing .more-info-footer-details-button .button-characters:hover,.IGear-listing .more-info-footer-details-button .button-characters:hover,.RPGFeat-listing .more-info-footer-details-button .button-characters:hover,.RPGBackground-listing .more-info-footer-details-button .button-characters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-characters:hover {
    transition: 100ms linear all;
    background: #ff9e22
}

 .more-info-footer-details-button .button-items,.RPGMonster-listing .more-info-footer-details-button .button-items,.RPGMagicItem-listing .more-info-footer-details-button .button-items,.ihomebrewable-listing .more-info-footer-details-button .button-items,.RPGSpell-listing .more-info-footer-details-button .button-items,.IGear-listing .more-info-footer-details-button .button-items,.RPGFeat-listing .more-info-footer-details-button .button-items,.RPGBackground-listing .more-info-footer-details-button .button-items,.RPGSubclass-listing .more-info-footer-details-button .button-items {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 16px;
    background: #0f5cbc;
    height: 50px;
    width: 100%;
    max-width: 300px;
    min-width: 250px;
    box-shadow: none;
    border: 0;
    transition: 100ms linear all;
    text-transform: uppercase;
    text-shadow: none
}

 .more-info-footer-details-button .button-items:hover,.RPGMonster-listing .more-info-footer-details-button .button-items:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-items:hover,.ihomebrewable-listing .more-info-footer-details-button .button-items:hover,.RPGSpell-listing .more-info-footer-details-button .button-items:hover,.IGear-listing .more-info-footer-details-button .button-items:hover,.RPGFeat-listing .more-info-footer-details-button .button-items:hover,.RPGBackground-listing .more-info-footer-details-button .button-items:hover,.RPGSubclass-listing .more-info-footer-details-button .button-items:hover {
    background: #1373eb
}

 .more-info-footer-details-button .button-items, .more-info-footer-details-button .button-items:hover, .more-info-footer-details-button .button-items:focus, .more-info-footer-details-button .button-items:active, .more-info-footer-details-button .button-items:visited,.RPGMonster-listing .more-info-footer-details-button .button-items,.RPGMonster-listing .more-info-footer-details-button .button-items:hover,.RPGMonster-listing .more-info-footer-details-button .button-items:focus,.RPGMonster-listing .more-info-footer-details-button .button-items:active,.RPGMonster-listing .more-info-footer-details-button .button-items:visited,.RPGMagicItem-listing .more-info-footer-details-button .button-items,.RPGMagicItem-listing .more-info-footer-details-button .button-items:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-items:focus,.RPGMagicItem-listing .more-info-footer-details-button .button-items:active,.RPGMagicItem-listing .more-info-footer-details-button .button-items:visited,.ihomebrewable-listing .more-info-footer-details-button .button-items,.ihomebrewable-listing .more-info-footer-details-button .button-items:hover,.ihomebrewable-listing .more-info-footer-details-button .button-items:focus,.ihomebrewable-listing .more-info-footer-details-button .button-items:active,.ihomebrewable-listing .more-info-footer-details-button .button-items:visited,.RPGSpell-listing .more-info-footer-details-button .button-items,.RPGSpell-listing .more-info-footer-details-button .button-items:hover,.RPGSpell-listing .more-info-footer-details-button .button-items:focus,.RPGSpell-listing .more-info-footer-details-button .button-items:active,.RPGSpell-listing .more-info-footer-details-button .button-items:visited,.IGear-listing .more-info-footer-details-button .button-items,.IGear-listing .more-info-footer-details-button .button-items:hover,.IGear-listing .more-info-footer-details-button .button-items:focus,.IGear-listing .more-info-footer-details-button .button-items:active,.IGear-listing .more-info-footer-details-button .button-items:visited,.RPGFeat-listing .more-info-footer-details-button .button-items,.RPGFeat-listing .more-info-footer-details-button .button-items:hover,.RPGFeat-listing .more-info-footer-details-button .button-items:focus,.RPGFeat-listing .more-info-footer-details-button .button-items:active,.RPGFeat-listing .more-info-footer-details-button .button-items:visited,.RPGBackground-listing .more-info-footer-details-button .button-items,.RPGBackground-listing .more-info-footer-details-button .button-items:hover,.RPGBackground-listing .more-info-footer-details-button .button-items:focus,.RPGBackground-listing .more-info-footer-details-button .button-items:active,.RPGBackground-listing .more-info-footer-details-button .button-items:visited,.RPGSubclass-listing .more-info-footer-details-button .button-items,.RPGSubclass-listing .more-info-footer-details-button .button-items:hover,.RPGSubclass-listing .more-info-footer-details-button .button-items:focus,.RPGSubclass-listing .more-info-footer-details-button .button-items:active,.RPGSubclass-listing .more-info-footer-details-button .button-items:visited {
    color: #fff
}

@media(min-width: 1024px) {
     .more-info-footer-details-button .button-items,.RPGMonster-listing .more-info-footer-details-button .button-items,.RPGMagicItem-listing .more-info-footer-details-button .button-items,.ihomebrewable-listing .more-info-footer-details-button .button-items,.RPGSpell-listing .more-info-footer-details-button .button-items,.IGear-listing .more-info-footer-details-button .button-items,.RPGFeat-listing .more-info-footer-details-button .button-items,.RPGBackground-listing .more-info-footer-details-button .button-items,.RPGSubclass-listing .more-info-footer-details-button .button-items {
        height:35px;
        font-size: 12px;
        min-width: 180px
    }
}

 .more-info-footer-details-button .button-items:hover,.RPGMonster-listing .more-info-footer-details-button .button-items:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-items:hover,.ihomebrewable-listing .more-info-footer-details-button .button-items:hover,.RPGSpell-listing .more-info-footer-details-button .button-items:hover,.IGear-listing .more-info-footer-details-button .button-items:hover,.RPGFeat-listing .more-info-footer-details-button .button-items:hover,.RPGBackground-listing .more-info-footer-details-button .button-items:hover,.RPGSubclass-listing .more-info-footer-details-button .button-items:hover {
    transition: 100ms linear all;
    background: #1373eb
}

 .more-info-footer-details-button .button-spells,.RPGMonster-listing .more-info-footer-details-button .button-spells,.RPGMagicItem-listing .more-info-footer-details-button .button-spells,.ihomebrewable-listing .more-info-footer-details-button .button-spells,.RPGSpell-listing .more-info-footer-details-button .button-spells,.IGear-listing .more-info-footer-details-button .button-spells,.RPGFeat-listing .more-info-footer-details-button .button-spells,.RPGBackground-listing .more-info-footer-details-button .button-spells,.RPGSubclass-listing .more-info-footer-details-button .button-spells {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 16px;
    background: #704cd9;
    height: 50px;
    width: 100%;
    max-width: 300px;
    min-width: 250px;
    box-shadow: none;
    border: 0;
    transition: 100ms linear all;
    text-transform: uppercase;
    text-shadow: none
}

 .more-info-footer-details-button .button-spells:hover,.RPGMonster-listing .more-info-footer-details-button .button-spells:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:hover,.ihomebrewable-listing .more-info-footer-details-button .button-spells:hover,.RPGSpell-listing .more-info-footer-details-button .button-spells:hover,.IGear-listing .more-info-footer-details-button .button-spells:hover,.RPGFeat-listing .more-info-footer-details-button .button-spells:hover,.RPGBackground-listing .more-info-footer-details-button .button-spells:hover,.RPGSubclass-listing .more-info-footer-details-button .button-spells:hover {
    background: #9276e2
}

 .more-info-footer-details-button .button-spells, .more-info-footer-details-button .button-spells:hover, .more-info-footer-details-button .button-spells:focus, .more-info-footer-details-button .button-spells:active, .more-info-footer-details-button .button-spells:visited,.RPGMonster-listing .more-info-footer-details-button .button-spells,.RPGMonster-listing .more-info-footer-details-button .button-spells:hover,.RPGMonster-listing .more-info-footer-details-button .button-spells:focus,.RPGMonster-listing .more-info-footer-details-button .button-spells:active,.RPGMonster-listing .more-info-footer-details-button .button-spells:visited,.RPGMagicItem-listing .more-info-footer-details-button .button-spells,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:focus,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:active,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:visited,.ihomebrewable-listing .more-info-footer-details-button .button-spells,.ihomebrewable-listing .more-info-footer-details-button .button-spells:hover,.ihomebrewable-listing .more-info-footer-details-button .button-spells:focus,.ihomebrewable-listing .more-info-footer-details-button .button-spells:active,.ihomebrewable-listing .more-info-footer-details-button .button-spells:visited,.RPGSpell-listing .more-info-footer-details-button .button-spells,.RPGSpell-listing .more-info-footer-details-button .button-spells:hover,.RPGSpell-listing .more-info-footer-details-button .button-spells:focus,.RPGSpell-listing .more-info-footer-details-button .button-spells:active,.RPGSpell-listing .more-info-footer-details-button .button-spells:visited,.IGear-listing .more-info-footer-details-button .button-spells,.IGear-listing .more-info-footer-details-button .button-spells:hover,.IGear-listing .more-info-footer-details-button .button-spells:focus,.IGear-listing .more-info-footer-details-button .button-spells:active,.IGear-listing .more-info-footer-details-button .button-spells:visited,.RPGFeat-listing .more-info-footer-details-button .button-spells,.RPGFeat-listing .more-info-footer-details-button .button-spells:hover,.RPGFeat-listing .more-info-footer-details-button .button-spells:focus,.RPGFeat-listing .more-info-footer-details-button .button-spells:active,.RPGFeat-listing .more-info-footer-details-button .button-spells:visited,.RPGBackground-listing .more-info-footer-details-button .button-spells,.RPGBackground-listing .more-info-footer-details-button .button-spells:hover,.RPGBackground-listing .more-info-footer-details-button .button-spells:focus,.RPGBackground-listing .more-info-footer-details-button .button-spells:active,.RPGBackground-listing .more-info-footer-details-button .button-spells:visited,.RPGSubclass-listing .more-info-footer-details-button .button-spells,.RPGSubclass-listing .more-info-footer-details-button .button-spells:hover,.RPGSubclass-listing .more-info-footer-details-button .button-spells:focus,.RPGSubclass-listing .more-info-footer-details-button .button-spells:active,.RPGSubclass-listing .more-info-footer-details-button .button-spells:visited {
    color: #fff
}

@media(min-width: 1024px) {
     .more-info-footer-details-button .button-spells,.RPGMonster-listing .more-info-footer-details-button .button-spells,.RPGMagicItem-listing .more-info-footer-details-button .button-spells,.ihomebrewable-listing .more-info-footer-details-button .button-spells,.RPGSpell-listing .more-info-footer-details-button .button-spells,.IGear-listing .more-info-footer-details-button .button-spells,.RPGFeat-listing .more-info-footer-details-button .button-spells,.RPGBackground-listing .more-info-footer-details-button .button-spells,.RPGSubclass-listing .more-info-footer-details-button .button-spells {
        height:35px;
        font-size: 12px;
        min-width: 180px
    }
}

 .more-info-footer-details-button .button-spells:hover,.RPGMonster-listing .more-info-footer-details-button .button-spells:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-spells:hover,.ihomebrewable-listing .more-info-footer-details-button .button-spells:hover,.RPGSpell-listing .more-info-footer-details-button .button-spells:hover,.IGear-listing .more-info-footer-details-button .button-spells:hover,.RPGFeat-listing .more-info-footer-details-button .button-spells:hover,.RPGBackground-listing .more-info-footer-details-button .button-spells:hover,.RPGSubclass-listing .more-info-footer-details-button .button-spells:hover {
    transition: 100ms linear all;
    background: #9276e2
}

 .more-info-footer-details-button .button-monsters,.RPGMonster-listing .more-info-footer-details-button .button-monsters,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters,.ihomebrewable-listing .more-info-footer-details-button .button-monsters,.RPGSpell-listing .more-info-footer-details-button .button-monsters,.IGear-listing .more-info-footer-details-button .button-monsters,.RPGFeat-listing .more-info-footer-details-button .button-monsters,.RPGBackground-listing .more-info-footer-details-button .button-monsters,.RPGSubclass-listing .more-info-footer-details-button .button-monsters {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    font-family: "Roboto Condensed",Roboto,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 16px;
    background: #bc0f0f;
    height: 50px;
    width: 100%;
    max-width: 300px;
    min-width: 250px;
    box-shadow: none;
    border: 0;
    transition: 100ms linear all;
    text-transform: uppercase;
    text-shadow: none
}

 .more-info-footer-details-button .button-monsters:hover,.RPGMonster-listing .more-info-footer-details-button .button-monsters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:hover,.RPGSpell-listing .more-info-footer-details-button .button-monsters:hover,.IGear-listing .more-info-footer-details-button .button-monsters:hover,.RPGFeat-listing .more-info-footer-details-button .button-monsters:hover,.RPGBackground-listing .more-info-footer-details-button .button-monsters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:hover {
    background: #eb1313
}

 .more-info-footer-details-button .button-monsters, .more-info-footer-details-button .button-monsters:hover, .more-info-footer-details-button .button-monsters:focus, .more-info-footer-details-button .button-monsters:active, .more-info-footer-details-button .button-monsters:visited,.RPGMonster-listing .more-info-footer-details-button .button-monsters,.RPGMonster-listing .more-info-footer-details-button .button-monsters:hover,.RPGMonster-listing .more-info-footer-details-button .button-monsters:focus,.RPGMonster-listing .more-info-footer-details-button .button-monsters:active,.RPGMonster-listing .more-info-footer-details-button .button-monsters:visited,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:focus,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:active,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:visited,.ihomebrewable-listing .more-info-footer-details-button .button-monsters,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:focus,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:active,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:visited,.RPGSpell-listing .more-info-footer-details-button .button-monsters,.RPGSpell-listing .more-info-footer-details-button .button-monsters:hover,.RPGSpell-listing .more-info-footer-details-button .button-monsters:focus,.RPGSpell-listing .more-info-footer-details-button .button-monsters:active,.RPGSpell-listing .more-info-footer-details-button .button-monsters:visited,.IGear-listing .more-info-footer-details-button .button-monsters,.IGear-listing .more-info-footer-details-button .button-monsters:hover,.IGear-listing .more-info-footer-details-button .button-monsters:focus,.IGear-listing .more-info-footer-details-button .button-monsters:active,.IGear-listing .more-info-footer-details-button .button-monsters:visited,.RPGFeat-listing .more-info-footer-details-button .button-monsters,.RPGFeat-listing .more-info-footer-details-button .button-monsters:hover,.RPGFeat-listing .more-info-footer-details-button .button-monsters:focus,.RPGFeat-listing .more-info-footer-details-button .button-monsters:active,.RPGFeat-listing .more-info-footer-details-button .button-monsters:visited,.RPGBackground-listing .more-info-footer-details-button .button-monsters,.RPGBackground-listing .more-info-footer-details-button .button-monsters:hover,.RPGBackground-listing .more-info-footer-details-button .button-monsters:focus,.RPGBackground-listing .more-info-footer-details-button .button-monsters:active,.RPGBackground-listing .more-info-footer-details-button .button-monsters:visited,.RPGSubclass-listing .more-info-footer-details-button .button-monsters,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:focus,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:active,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:visited {
    color: #fff
}

@media(min-width: 1024px) {
     .more-info-footer-details-button .button-monsters,.RPGMonster-listing .more-info-footer-details-button .button-monsters,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters,.ihomebrewable-listing .more-info-footer-details-button .button-monsters,.RPGSpell-listing .more-info-footer-details-button .button-monsters,.IGear-listing .more-info-footer-details-button .button-monsters,.RPGFeat-listing .more-info-footer-details-button .button-monsters,.RPGBackground-listing .more-info-footer-details-button .button-monsters,.RPGSubclass-listing .more-info-footer-details-button .button-monsters {
        height:35px;
        font-size: 12px;
        min-width: 180px
    }
}

 .more-info-footer-details-button .button-monsters:hover,.RPGMonster-listing .more-info-footer-details-button .button-monsters:hover,.RPGMagicItem-listing .more-info-footer-details-button .button-monsters:hover,.ihomebrewable-listing .more-info-footer-details-button .button-monsters:hover,.RPGSpell-listing .more-info-footer-details-button .button-monsters:hover,.IGear-listing .more-info-footer-details-button .button-monsters:hover,.RPGFeat-listing .more-info-footer-details-button .button-monsters:hover,.RPGBackground-listing .more-info-footer-details-button .button-monsters:hover,.RPGSubclass-listing .more-info-footer-details-button .button-monsters:hover {
    transition: 100ms linear all;
    background: #eb1313
}

 .more-info-footer-tags,.RPGMonster-listing .more-info-footer-tags,.RPGMagicItem-listing .more-info-footer-tags,.ihomebrewable-listing .more-info-footer-tags,.RPGSpell-listing .more-info-footer-tags,.IGear-listing .more-info-footer-tags,.RPGFeat-listing .more-info-footer-tags,.RPGBackground-listing .more-info-footer-tags,.RPGSubclass-listing .more-info-footer-tags {
    font-size: 12px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    margin: 0 10px;
    padding: 10px 0;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0
}

 .more-info-footer-tags .tag,.RPGMonster-listing .more-info-footer-tags .tag,.RPGMagicItem-listing .more-info-footer-tags .tag,.ihomebrewable-listing .more-info-footer-tags .tag,.RPGSpell-listing .more-info-footer-tags .tag,.IGear-listing .more-info-footer-tags .tag,.RPGFeat-listing .more-info-footer-tags .tag,.RPGBackground-listing .more-info-footer-tags .tag,.RPGSubclass-listing .more-info-footer-tags .tag {
    border: 1px solid #cbc6c3;
    background-color: #fff;
    box-shadow: inset 0 0 4px 0 #dcd1c7;
    padding: 4px 8px;
    font-size: 9px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    display: inline-block;
    margin: 0 2px
}

@media(min-width: 1024px) {
     .more-info-footer-tags,.RPGMonster-listing .more-info-footer-tags,.RPGMagicItem-listing .more-info-footer-tags,.ihomebrewable-listing .more-info-footer-tags,.RPGSpell-listing .more-info-footer-tags,.IGear-listing .more-info-footer-tags,.RPGFeat-listing .more-info-footer-tags,.RPGBackground-listing .more-info-footer-tags,.RPGSubclass-listing .more-info-footer-tags {
        margin-left:0
    }
}

 .more-info-footer-classes,.RPGMonster-listing .more-info-footer-classes,.RPGMagicItem-listing .more-info-footer-classes,.ihomebrewable-listing .more-info-footer-classes,.RPGSpell-listing .more-info-footer-classes,.IGear-listing .more-info-footer-classes,.RPGFeat-listing .more-info-footer-classes,.RPGBackground-listing .more-info-footer-classes,.RPGSubclass-listing .more-info-footer-classes {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0
}

 .more-info-footer-source,.RPGMonster-listing .more-info-footer-source,.RPGMagicItem-listing .more-info-footer-source,.ihomebrewable-listing .more-info-footer-source,.RPGSpell-listing .more-info-footer-source,.IGear-listing .more-info-footer-source,.RPGFeat-listing .more-info-footer-source,.RPGBackground-listing .more-info-footer-source,.RPGSubclass-listing .more-info-footer-source {
    font-style: italic;
    text-align: right;
    min-width: 110px;
    padding: 10px;
    margin-left: auto
}

.body-rpgigear  .more-info-footer-source,.body-rpgigear .RPGMonster-listing .more-info-footer-source,.body-rpgigear .RPGMagicItem-listing .more-info-footer-source,.body-rpgigear .ihomebrewable-listing .more-info-footer-source,.body-rpgigear .RPGSpell-listing .more-info-footer-source,.body-rpgigear .IGear-listing .more-info-footer-source,.body-rpgigear .RPGFeat-listing .more-info-footer-source,.body-rpgigear .RPGBackground-listing .more-info-footer-source,.body-rpgigear .RPGSubclass-listing .more-info-footer-source {
    display: none
}

 .more-info-footer-edit-button,.RPGMonster-listing .more-info-footer-edit-button,.RPGMagicItem-listing .more-info-footer-edit-button,.ihomebrewable-listing .more-info-footer-edit-button,.RPGSpell-listing .more-info-footer-edit-button,.IGear-listing .more-info-footer-edit-button,.RPGFeat-listing .more-info-footer-edit-button,.RPGBackground-listing .more-info-footer-edit-button,.RPGSubclass-listing .more-info-footer-edit-button {
    position: absolute;
    top: 0;
    left: 0
}

 .more-info-footer-homebrew-actions,.RPGMonster-listing .more-info-footer-homebrew-actions,.RPGMagicItem-listing .more-info-footer-homebrew-actions,.ihomebrewable-listing .more-info-footer-homebrew-actions,.RPGSpell-listing .more-info-footer-homebrew-actions,.IGear-listing .more-info-footer-homebrew-actions,.RPGFeat-listing .more-info-footer-homebrew-actions,.RPGBackground-listing .more-info-footer-homebrew-actions,.RPGSubclass-listing .more-info-footer-homebrew-actions {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1
}

@media(min-width: 1024px) {
     .more-info-footer-homebrew-actions,.RPGMonster-listing .more-info-footer-homebrew-actions,.RPGMagicItem-listing .more-info-footer-homebrew-actions,.ihomebrewable-listing .more-info-footer-homebrew-actions,.RPGSpell-listing .more-info-footer-homebrew-actions,.IGear-listing .more-info-footer-homebrew-actions,.RPGFeat-listing .more-info-footer-homebrew-actions,.RPGBackground-listing .more-info-footer-homebrew-actions,.RPGSubclass-listing .more-info-footer-homebrew-actions {
        -webkit-order:unset;
        -ms-flex-order: unset;
        order: unset;
        margin-left: 0
    }
}

 .more-info::after,.RPGMonster-listing .more-info::after,.RPGMagicItem-listing .more-info::after,.ihomebrewable-listing .more-info::after,.RPGSpell-listing .more-info::after,.IGear-listing .more-info::after,.RPGFeat-listing .more-info::after,.RPGBackground-listing .more-info::after,.RPGSubclass-listing .more-info::after {
    content: '';
    display: block;
    height: 28px;
    width: calc(100% + 40px);
    border-bottom: 28px solid transparent;
    border-image: url("../images/expanded-listing-item-bottom-border.png") 28 stretch;
    position: relative;
    top: 4px;
    margin: 0 -20px
}

@media(min-width: 1024px) {
     .more-info::after,.RPGMonster-listing .more-info::after,.RPGMagicItem-listing .more-info::after,.ihomebrewable-listing .more-info::after,.RPGSpell-listing .more-info::after,.IGear-listing .more-info::after,.RPGFeat-listing .more-info::after,.RPGBackground-listing .more-info::after,.RPGSubclass-listing .more-info::after {
        width:calc(100% + 52px);
        margin: 0 -26px
    }
}

.more-info .treasure-link {
    text-decoration: underline
}


.mon-stat-block-2024 {
    background-image: none!important;
    background: #f5f3ee!important;
    border: 1px solid #afa47a;
    outline: 1px solid #afa47a;
    outline-offset: -0.25rem;
    border-radius: .5rem
}

.mon-stat-block-2024 {
    background: url("../images/mon-summary/stat-block-top-texture.png"),url("../images/mon-summary/paper-texture.png");
    background-size: 100% auto;
    background-position: top center;
    background-repeat: no-repeat,repeat;
    position: relative;
    box-shadow: 0 0 5px #979AA4;
    border: 1px solid #d4d0ce;
    padding: 15px;
    margin: 15px 0;
    font-family: "Scala Sans Offc",Roboto,Helvetica,sans-serif;
    font-size: 15px
}

.mon-stat-block-2024::before,.mon-stat-block-2024::after {
    content: "";
    display: block;
    background: url("../images/mon-summary/stat-bar-book.png") center;
    background-size: 100% 100%;
    height: 6px;
    position: absolute;
    left: -3px;
    right: -3px
}

.mon-stat-block-2024::before {
    top: -3px
}

.mon-stat-block-2024::after {
    bottom: -3px
}

.mon-stat-block-2024__separator-img {
    max-width: 100%;
    min-height: 10px
}

.mon-stat-block-2024__header {
    line-height: 1.1
}

.mon-stat-block-2024__name {
    font-weight: bold;
    font-size: 34px;
    font-family: MrsEavesSmallCaps,Roboto,Helvetica,sans-serif;
    color: #822000
}

.mon-stat-block-2024__name .mon-stat-block-2024__name-link {
    color: #822000
}

.mon-stat-block-2024__name .mon-stat-block-2024__name-link:hover,.mon-stat-block-2024__name .mon-stat-block-2024__name-link:visited,.mon-stat-block-2024__name .mon-stat-block-2024__name-link:active {
    color: #822000
}

.mon-stat-block-2024__meta {
    font-style: italic;
    margin-bottom: 15px
}

.mon-stat-block-2024__attribute,.mon-stat-block-2024__feature {
    margin: 5px 0;
    color: #822000;
    line-height: 1.2
}

.mon-stat-block-2024__attribute-label,.mon-stat-block-2024__feature-label {
    font-weight: bold
}

.mon-stat-block-2024__feature-label {
    font-style: italic
}

.mon-stat-block-2024__stat-block .ability-block {
    color: #822000;
    margin: 0
}

.mon-stat-block-2024__tidbit {
    margin: 5px 0;
    color: #822000;
    line-height: 1.2
}

.mon-stat-block-2024__tidbit-label {
    font-weight: bold
}

.mon-stat-block-2024__tidbit-container {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.mon-stat-block-2024__tidbit-spacer {
    width: 40px;
    min-width: 10px
}

.mon-stat-block-2024__description-blocks {
    margin-top: 20px
}

.mon-stat-block-2024__description-block-heading,.mon-stat-block-2024__description-block h3 {
    border-bottom: 1px solid #822000;
    color: #822000;
    font-size: 24px;
    font-weight: normal;
    font-family: "Scala Sans Offc",Roboto,Helvetica,sans-serif;
    line-height: 1.4;
    margin-top: 20px;
    margin-bottom: 15px
}

.mon-stat-block-2024__description-block p {
    margin-bottom: 10px
}

.mon-stat-block-2024 .tooltip-hover {
    font-weight: bold!important
}

.mon-stat-block-2024 .tooltip-hover,.mon-stat-block-2024 .tooltip-hover:hover,.mon-stat-block-2024 .tooltip-hover:focus,.mon-stat-block-2024 .tooltip-hover:active,.mon-stat-block-2024 .tooltip-hover:visited {
    color: inherit!important;
    font-weight: inherit!important;
    text-decoration: underline;
    text-decoration: underline solid #47D18C
}

.mon-stat-block-2024 .tooltip-hover.spell-tooltip,.mon-stat-block-2024 .tooltip-hover.spell-tooltip:hover,.mon-stat-block-2024 .tooltip-hover.spell-tooltip:focus,.mon-stat-block-2024 .tooltip-hover.spell-tooltip:active,.mon-stat-block-2024 .tooltip-hover.spell-tooltip:visited {
    color: inherit!important;
    font-weight: inherit!important;
    text-decoration: underline;
    text-decoration: underline solid #704cd9
}

.mon-stat-block-2024 .tooltip-hover.monster-tooltip,.mon-stat-block-2024 .tooltip-hover.monster-tooltip:hover,.mon-stat-block-2024 .tooltip-hover.monster-tooltip:focus,.mon-stat-block-2024 .tooltip-hover.monster-tooltip:active,.mon-stat-block-2024 .tooltip-hover.monster-tooltip:visited {
    color: inherit!important;
    font-weight: inherit!important;
    text-decoration: underline;
    text-decoration: underline solid #bc0f0f
}

.mon-stat-block-2024 .tooltip-hover.magic-item-tooltip,.mon-stat-block-2024 .tooltip-hover.magic-item-tooltip:hover,.mon-stat-block-2024 .tooltip-hover.magic-item-tooltip:focus,.mon-stat-block-2024 .tooltip-hover.magic-item-tooltip:active,.mon-stat-block-2024 .tooltip-hover.magic-item-tooltip:visited {
    color: inherit!important;
    font-weight: inherit!important;
    text-decoration: underline;
    text-decoration: underline solid #0f5cbc
}

.mon-stat-block-2024 .tooltip-hover.vehicles-tooltip,.mon-stat-block-2024 .tooltip-hover.vehicles-tooltip:hover,.mon-stat-block-2024 .tooltip-hover.vehicles-tooltip:focus,.mon-stat-block-2024 .tooltip-hover.vehicles-tooltip:active,.mon-stat-block-2024 .tooltip-hover.vehicles-tooltip:visited {
    color: inherit!important;
    font-weight: inherit!important;
    text-decoration: underline;
    text-decoration: underline solid #1b9af0
}
.tooltip-hover.loading-tooltip:hover:after {
    position  : fixed;
    left: var(--cursor-offsetX);
    top: var(--cursor-offsetY);
    z-index   : 1000000;
    width     : 20px;
    height    : 20px;
    background: url(https://dndbeyond.com/content/1-0-3132-0/skins/waterdeep/images/character-sheet/loading-ring.svg) no-repeat;
    background-size: contain;
    content: '';
}

#displayedDiceFormula{
    position: fixed;
    bottom: 20px;
    left: calc(50% - 180px);
    transform: translateX(-50%);
    z-index: 1000000;
    display: block;
    pointer-events: none;
    border: 1px solid #ddd;
    background: #000000f0;
    color: #fff;
    width: fit-content;
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
}
#displayedDiceFormula span{
    display:block;
    text-align:center;
    font-size:16px;
}
button#displayedDiceFormulaExit {
    position:absolute;
    font-size:12px;
    background:#00000000;
    color:#fff;
    border-radius:5px;
    outline:none;
    pointer-events:auto;
    top: 0px;
    right:-3px;
    border:none;
}
button#displayedDiceFormulaExit:hover {
    color:#f00;
}
@media print,(min-width: 1480px) {
    .mon-stat-block-2024 {
        -webkit-column-count:2;
        column-count: 2
    }
}

@media print {
    .mon-stat-block-2024 {
        box-shadow: none;
        background: 0
    }

    .mon-stat-block-2024::before {
        border-top: 6px solid #999
    }

    .mon-stat-block-2024::after {
        border-bottom: 6px solid #999
    }
}

.mon-stat-block-2024::before,.mon-stat-block-2024::after {
    display: none
}

.mon-stat-block-2024__name {
    border-bottom: .063rem solid #5b160c;
    font-family: "Scala Sans Sc Offc",Roboto,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 1.75rem;
    -webkit-column-span: all;
    column-span: all;
    margin-bottom: .45rem
}

.mon-stat-block-2024__name .mon-stat-block-2024__name-link,.mon-stat-block-2024__name .mon-stat-block-2024__name-link:visited,.mon-stat-block-2024__attribute,.mon-stat-block-2024__tidbit,.mon-stat-block-2024__description-block-heading {
    color: #5b160c
}

.mon-stat-block-2024__description-block-heading {
    border-bottom: .063rem solid #5b160c;
    font-size: 1.25rem;
    font-family: "Scala Sans Sc Offc",Roboto,Helvetica,sans-serif;
    font-weight: normal;
    line-height: 1.4;
    margin-top: 1.25rem;
    margin-bottom: .938rem
}

.mon-stat-block-2024__meta {
    color: #68747b;
    margin-bottom: .938rem;
    margin-top: .188rem
}

.mon-stat-block-2024__stats {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: .625rem
}

:is(.tooltip) .stat-block {
    --sb-monster-header-underline: #7a3c2f;
    border: 1px solid #a7a3a0;
    background-color: #FEFCEF;
    padding: 10px;
    position: relative;
    background-repeat: no-repeat;
    box-shadow: 0 5px 8px 0 var(--sb-stat-block-shadow,#AAA);
    background-position: top;
    background: var(--sb-stat-block-bg-override,#f6f3ee);
    font-size: 16px;
    line-height: 19.6px;
    border-radius: 8px;
    outline: 1px solid #a7a3a0;
    outline-offset: -4px;
    font-family: var(--sb-stat-block-font,Roboto,Helvetica,sans-serif);
    -webkit-columns: 2 384px;
    columns: 2 384px
}

:is(.tooltip) .stat-block:is(h2,h3,h4,h5) {
    font-size: 22px;
    font-family: "Roboto Condensed";
    text-transform: uppercase;
    font-weight: bold;
    margin-right: 8px;
    -webkit-margin-after: 0;
    margin-block-end:0}

:is(.tooltip) .stat-block:is(h2,h3,h4,h5)::after {
    content: "";
    display: block;
    width: 100%;
    margin: 2px auto 8px;
    height: 1px;
    background: var(--sb-monster-header-underline,#7a3c2f);
    -webkit-column-span: all;
    column-span: all
}

:is(.tooltip) .stat-block p {
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 0
}

:is(.tooltip) .stat-block p+p {
    margin-top: 10px
}

:is(.tooltip) .stat-block p[class]:first-of-type {
    margin-top: 0;
    font-style: italic;
    opacity: .7
}

:is(.tooltip) .stat-block p[class]:first-of-type+p {
    margin-top: 16px
}

:is(.tooltip) .stat-block:is(ol,ul,dl) {
    margin-bottom: 0;
    padding-top: 0
}

:is(.tooltip) .monster-header {
    padding-top: 4px;
    letter-spacing: .35px;
    font-weight: 500;
    color: var(--sb-monster-header-color,#5b160c);
    font-size: var(--sb-monster-trait-header-size,18px);
    font-family: var(--sb-monster-trait-header-font,"Roboto Condensed",Helvetica,sans-serif);
    border-bottom: 2px solid var(--sb-monster-header-underline,#7a3c2f)
}

:is(.tooltip) .stat-block .monster-header+p {
    -webkit-column-break-before: avoid;
    break-before: avoid
}

:is(.tooltip) .stat-block .stats {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

:is(.tooltip) .stat-block .stats+p {
    margin-top: 10px
}

:is(.tooltip) .stat-block .stats table.abilities-saves {
    --sb-theme-table-row-color: transparent;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    line-height: 24px;
    background: revert;
    border: 0;
    font-size: 16px;
    -webkit-column-break-inside: avoid;
    break-inside: avoid
}

:is(.tooltip) .stat-block .stats table.abilities-saves.physical {
    --sb-stats-score: #ede6d9;
    --sb-stats-mods: #ded4cc;
    --sb-stats-score-hover: #997f6d7d;
    --sb-stats-mods-hover: #996d727d
}

:is(.tooltip) .stat-block .stats table.abilities-saves.mental {
    --sb-stats-score: #d8dad1;
    --sb-stats-mods: #d0caca;
    --sb-stats-score-hover: #6d8d997d;
    --sb-stats-mods-hover: #756d997d
}

:is(.tooltip) .stat-block .stats table.abilities-saves thead {
    border: 0;
    height: revert;
    min-height: 45px
}

:is(.tooltip) .stat-block .stats table.abilities-saves thead tr {
    height: revert;
    min-height: 45px
}

:is(.tooltip) .stat-block .stats table.abilities-saves thead tr th {
    padding: 5px 2px 0!important;
    background: inherit;
    color: inherit;
    vertical-align: bottom;
    border: 0;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody {
    border: 0
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr {
    background-color: var(--sb-theme-table-row-color,#fdfdfd);
    color: var(--sb-theme-table-header-fg-color,#222)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr:hover {
    background-color: var(--sb-stats-hover)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr:hover *:nth-child(-n+3) {
    background-color: var(--sb-stats-score-hover)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr:hover *:nth-child(n+3) {
    background-color: var(--sb-stats-mods-hover)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr *:nth-child(-n+3) {
    background-color: var(--sb-stats-score)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody tr *:nth-child(n+3) {
    background-color: var(--sb-stats-mods)
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody th {
    text-transform: uppercase;
    font-weight: bold;
    border: 0;
    padding-left: 6px;
    font-size: 16px
}

:is(.tooltip) .stat-block .stats table.abilities-saves tbody td {
    min-width: revert;
    padding: 5px 10px!important;
    border: 0;
    font-size: 16px
}

:is(.tooltip) .stat-block .stats table.abilities-saves tr:is(th,td) {
    transition: background-color .3s
}

:is(.tooltip) .stat-block p:nth-of-type(2) strong+strong {
    margin-left: 30px
}

.summoning-creatures-table,.compendium-left-aligned-table {
    width: auto
}

.summoning-creatures-table td,.compendium-left-aligned-table td {
    text-align: left!important;
    padding: 8px 20px!important
}

.summoning-creatures-table td:nth-child(1),.compendium-left-aligned-table td:nth-child(1) {
    vertical-align: middle!important;
    padding: 8px 20px!important;
    line-height: 1.4!important
}

.compendium-left-aligned-table {
    width: 100%!important
}

.compendium-left-aligned-table th:nth-child(1) {
    text-align: center!important;
    width: 120px!important
}

.spell-level-column {
    width: 5%
}

:is(.tooltip) th.table-column-width--10pct {
    width: 10%
}

:is(.tooltip) th.table-column-width--15pct {
    width: 15%
}

:is(.tooltip) th.table-column-width--20pct {
    width: 20%
}

:is(.tooltip) .table-compendium tr>:is(th,td) {
    padding: 8px 16px!important
}

:is(.tooltip) table.table-compendium>thead>tr {
    background-color: var(--sb-table-header-bg-color,#FDFDFD)!important;
    color: var(--sb-table-header-fg-color,#222)!important
}

:is(.tooltip) table.table-compendium>tbody>tr:nth-child(odd) {
    background-color: var(--sb-table-row-bg-dark,#faf8f7)!important;
    color: var(--sb-table-row-fg-dark,#222)
}

:is(.tooltip) table.table-compendium>tbody>tr:nth-child(even),:is(.tooltip) table.table-compendium tbody tr:nth-child(even) {
    background-color: var(--sb-table-row-bg-light,#FDFDFD);
    color: var(--sb-table-row-fg-light,#222)
}

:is(.tooltip) table thead th {
    background: inherit;
    color: inherit
}

:is(.tooltip) table.table-compendium tr {
    transition: background-color .3s
}

:is(.tooltip) table.table-compendium tr td {
    vertical-align: middle
}

:is(.tooltip) table.table-compendium>tbody>tr:hover {
    background-color: var(--sb-table-row-bg-hover,#e3f4eb)!important;
    color: var(--sb-table-row-fg-hover,#222)
}

:is(.tooltip) table.table--weapons tr>:is(th,td):nth-child(odd) {
    text-align: left!important
}

:is(.tooltip) table.table--equipment tr>:is(th,td):first-child {
    width: 50%;
    text-align: left!important
}

:is(.tooltip) .table--generic-dice tr>:is(th,td):first-child,:is(.tooltip) .table--generic-dice-first tr>:is(th,td):first-child,:is(.tooltip) .table--generic-dice-col2 tr>:is(th,td):nth-child(2),:is(.tooltip) .table--generic-dice-col3 tr>:is(th,td):nth-child(3),:is(.tooltip) .table--generic-dice-col4 tr>:is(th,td):nth-child(4),:is(.tooltip) .table--generic-dice-col5 tr>:is(th,td):nth-child(5),:is(.tooltip) .table--generic-dice-last tr>:is(th,td):last-child {
    width: 12%;
    font-weight: bold
}

:is(.tooltip) .table--generic-dice:is(th,td):nth-child(2) {
    text-align: left
}

:is(.tooltip) .table--left-all tr>:is(th,td),:is(.tooltip) .table--left-first tr>:is(th,td):first-child,:is(.tooltip) .table--left-col2 tr>:is(th,td):nth-child(2),:is(.tooltip) .table--left-col3 tr>:is(th,td):nth-child(3),:is(.tooltip) .table--left-col4 tr>:is(th,td):nth-child(4),:is(.tooltip) .table--left-col5 tr>:is(th,td):nth-child(5),:is(.tooltip) .table--left-last tr>:is(th,td):last-child {
    text-align: left
}

:is(.tooltip) table caption {
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    margin-top: 8px;
    margin-bottom: 12px;
    font-family: Roboto,Helvetica,sans-serif;
    line-height: 1.3
}

:is(.tooltip) table caption>:is(h2,h3,h4,h5) {
    font-size: 16px!important;
    font-weight: 700!important
}

:is(.tooltip) table caption>:is(h2,h3)::after {
    content: none!important
}

:is(.tooltip) .table-compendium.table--sub-features thead th:first-of-type {
    width: 15%
}

:is(.tooltip) .table-compendium.table--sub-features:is(thead,tbody) tr>:is(th,td):nth-child(2) {
    text-align: left!important
}

:is(.tooltip) .table--features tr>:is(th,td):nth-child(3) {
    padding-left: 10px!important;
    text-align: left!important;
    width: 20%
}

:is(.tooltip) .table--features tr>:is(th,td):is(:first-child,:nth-child(2),:nth-child(n+4)) {
    padding-left: 5px 10px!important;
    min-width: 0!important
}

:is(.tooltip) tbody th {
    padding-left: 20px
}

:is(.tooltip) a.sourcebook {
    font-style: italic
}
.stat-table {
    margin: 0 0 .5rem
}

.stat-table,.stat-table thead,.stat-table tr,.stat-table th,.stat-table tbody,.stat-table td {
    border: 0
}

.stat-table td {
    padding: .125rem .5rem
}

.stat-table thead tr th {
    background: inherit;
    color: #68747b!important;
    font-weight: 400;
    padding: .3125rem .125rem 0;
    text-transform: uppercase;
    font-family: Roboto,Helvetica,sans-serif;
    font-size: .6875rem
}

.stat-table tbody tr {
    border-top: .0625rem solid #fff;
    border-bottom: .0625rem solid #fff;
    color: #5b160c;
    text-align: center;
    font-size: .938rem
}

.stat-table tbody tr th {
    padding: initial
}

.stat-table.physical tbody tr th,.stat-table.physical tbody tr td {
    background: #ede6d9
}

.stat-table.mental tbody tr th,.stat-table.mental tbody tr td {
    background: #d8dad1
}

.stat-table.physical td.modifier {
    background: #ded4cc
}

.stat-table.mental td.modifier {
    background: #d0caca
}


.tooltip-body{
        
    .i-external-link,.i-hamburger,.i-concentration,.i-homebrew,.i-spell-melee,.i-spell-ranged,.i-favorite,.i-strength-save,.i-dexterity-save,.i-constitution-save,.i-charisma-save,.i-wisdom-save,.i-intelligence-save,.i-type-acid,.i-type-bludgeoning,.i-type-cold,.i-type-fire,.i-type-force,.i-type-lightning,.i-type-necrotic,.i-type-piercing,.i-type-poison,.i-type-psychic,.i-type-radiant,.i-type-slashing,.i-type-thunder,.i-condition-blinded,.i-condition-charmed,.i-condition-deafened,.i-condition-exhaustion,.i-condition-exhausted,.i-condition-frightened,.i-condition-grappled,.i-condition-incapacitated,.i-condition-invisible,.i-condition-paralyzed,.i-condition-petrified,.i-condition-poisoned,.i-condition-prone,.i-condition-restrained,.i-condition-stunned,.i-condition-unconscious,.i-condition-white-blinded,.i-condition-white-charmed,.i-condition-white-deafened,.i-condition-white-exhaustion,.i-condition-white-exhausted,.i-condition-white-frightened,.i-condition-white-grappled,.i-condition-white-incapacitated,.i-condition-white-invisible,.i-condition-white-paralyzed,.i-condition-white-petrified,.i-condition-white-poisoned,.i-condition-white-prone,.i-condition-white-restrained,.i-condition-white-stunned,.i-condition-white-unconscious,.i-aoe-cone,.i-aoe-cube,.i-aoe-cylinder,.i-aoe-emanation,.i-aoe-line,.i-aoe-sphere,.i-aoe-square,.i-artificer,.i-bard,.i-cleric,.i-druid,.i-paladin,.i-ranger,.i-sorcerer,.i-warlock,.i-wizard,.i-barbarian,.i-fighter,.i-monk,.i-rogue,.i-aberration,.i-beast,.i-celestial,.i-construct,.i-dragon,.i-elemental,.i-fey,.i-fiend,.i-giant,.i-humanoid,.i-monstrosity,.i-ooze,.i-plant,.i-undead,.i-ritual,.i-req-attunement,.i-legendary-monster,.i-checkmark,.i-partnered-content-small,.i-partnered-content-medium,.i-partnered-content-large,.i-copy,.i-download,.i-download-blue,.i-gift,.i-play-url,.i-radio-checked,.i-radio-empty,.i-radio-checked-light,.i-three-dots {
        width: 16px;
        height: 16px;
        margin-right: 5px;
        display: inline-block;
        text-indent: -99999px;
        background-position: center center;
        background-repeat: no-repeat;
        vertical-align: middle
    }

    .i-external-link {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/external-link.svg);
        width: 20px;
        height: 20px
    }

    .i-hamburger {
        position: relative;
        margin-right: 13px
    }

    .i-hamburger::before {
        content: "";
        position: absolute;
        left: 4px;
        top: 4px;
        width: 100%;
        height: 2px;
        background: #979aa4;
        box-shadow: 0 5px 0 0 #979aa4,0 10px 0 0 #979aa4
    }

    .i-concentration {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/core_mechanics/concentration.svg)
    }

    .rpgspell-listing .i-concentration {
        margin-left: 3px
    }

    .i-homebrew {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/homebrew.svg);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 8px 8px;
        background-color: #45cef7;
        border-radius: 50%;
        margin-right: 3px
    }

    .i-spell-melee {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/attack_types/melee_spell.svg)
    }

    .i-spell-ranged {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/attack_types/ranged_spell.svg)
    }

    .i-favorite {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/sprites/fav_star.svg);
        background-position: 0 0;
        background-size: cover;
        height: 20px;
        width: 20px
    }

    .i-favorite.joe-blow {
        background-position: -20px 0
    }

    .i-strength-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/strength.svg)
    }

    .i-dexterity-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/dexterity.svg)
    }

    .i-constitution-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/constitution.svg)
    }

    .i-charisma-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/charisma.svg)
    }

    .i-wisdom-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/wisdom.svg)
    }

    .i-intelligence-save {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/abilities/intelligence.svg)
    }

    .i-type-acid {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/acid.svg)
    }

    .i-type-bludgeoning {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/bludgeoning.svg)
    }

    .i-type-cold {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/cold.svg)
    }

    .i-type-fire {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/fire.svg)
    }

    .i-type-force {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/force.svg)
    }

    .i-type-lightning {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/lightning.svg)
    }

    .i-type-necrotic {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/necrotic.svg)
    }

    .i-type-piercing {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/piercing.svg)
    }

    .i-type-poison {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/poison.svg)
    }

    .i-type-psychic {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/psychic.svg)
    }

    .i-type-radiant {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/radiant.svg)
    }

    .i-type-slashing {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/slashing.svg)
    }

    .i-type-thunder {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/damage_types/thunder.svg)
    }

    .i-condition-blinded {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/blinded.svg)
    }

    .i-condition-charmed {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/charmed.svg)
    }

    .i-condition-deafened {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/deafened.svg)
    }

    .i-condition-exhaustion {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/exhaustion.svg)
    }

    .i-condition-exhausted {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/exhausted.svg)
    }

    .i-condition-frightened {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/frightened.svg)
    }

    .i-condition-grappled {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/grappled.svg)
    }

    .i-condition-incapacitated {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/incapacitated.svg)
    }

    .i-condition-invisible {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/invisible.svg)
    }

    .i-condition-paralyzed {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/paralyzed.svg)
    }

    .i-condition-petrified {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/petrified.svg)
    }

    .i-condition-poisoned {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/poisoned.svg)
    }

    .i-condition-prone {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/prone.svg)
    }

    .i-condition-restrained {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/restrained.svg)
    }

    .i-condition-stunned {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/stunned.svg)
    }

    .i-condition-unconscious {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/unconscious.svg)
    }

    .i-condition-white-blinded {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/blinded.svg)
    }

    .i-condition-white-charmed {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/charmed.svg)
    }

    .i-condition-white-deafened {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/deafened.svg)
    }

    .i-condition-white-exhaustion {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/exhaustion.svg)
    }

    .i-condition-white-exhausted {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/exhausted.svg)
    }

    .i-condition-white-frightened {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/frightened.svg)
    }

    .i-condition-white-grappled {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/grappled.svg)
    }

    .i-condition-white-incapacitated {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/incapacitated.svg)
    }

    .i-condition-white-invisible {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/invisible.svg)
    }

    .i-condition-white-paralyzed {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/paralyzed.svg)
    }

    .i-condition-white-petrified {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/petrified.svg)
    }

    .i-condition-white-poisoned {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/poisoned.svg)
    }

    .i-condition-white-prone {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/prone.svg)
    }

    .i-condition-white-restrained {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/restrained.svg)
    }

    .i-condition-white-stunned {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/stunned.svg)
    }

    .i-condition-white-unconscious {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/conditions/white/unconscious.svg)
    }

    .i-aoe-cone {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/cone.svg);
        position: relative;

    }

    .i-aoe-cube {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/cube.svg);
        position: relative;
    }

    .i-aoe-cylinder {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/cylinder.svg);
        position: relative;
    }

    .i-aoe-emanation {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/emanation.svg);
        position: relative;

    }

    .i-aoe-line {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/line.svg);
        position: relative;

    }

    .i-aoe-sphere {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/sphere.svg);
        position: relative;

    }

    .i-aoe-square {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/areas_of_effect/square.svg);
        position: relative;

    }

    .i-artificer {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/artificer_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-bard {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/bard_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-cleric {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/cleric_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-druid {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/druid_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-paladin {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/paladin_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-ranger {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/ranger_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-sorcerer {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/sorcerer_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-warlock {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/warlock_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-wizard {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/wizard_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-barbarian {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/barbarian_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-fighter {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/fighter_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-monk {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/monk_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-rogue {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/classes/rogue_icon@2x.png);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-aberration {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/aberration_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-beast {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/beast_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-celestial {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/celestial_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-construct {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/construct_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-dragon {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/dragon_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-elemental {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/elemental_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-fey {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/fey_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-fiend {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/fiend_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-giant {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/giant_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-humanoid {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/humanoid_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-monstrosity {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/monstrosity_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-ooze {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/ooze_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-plant {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/plant_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-undead {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/monsters/undead_icon.jpg);
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain
    }

    .i-aoe-square {
        top: 2px;
        left: 1px;
        height: 13px;
        width: 13px
    }

    .i-type-acid {
        margin-right: 0;
        width: 15px
    }

    .i-ritual,.i-req-attunement {
        background-size: cover;
        height: 12px;
        width: 12px;
        margin-left: 3px
    }

    .i-ritual {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/core_mechanics/ritual.svg);
        background-repeat: no-repeat;
        background-size: 100% 100%
    }

    .i-req-attunement {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/attunement.png)
    }

    .i-legendary-monster {
        height: 12px;
        width: 12px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/legendary-monster.svg);
        margin-left: 3px
    }

    .body-rpgmonster-details .i-legendary-monster {
        height: 16px;
        width: 16px
    }

    .i-checkmark {
        height: 20px;
        width: 20px;
        background-image: url("../images/icons/yes-no/check-black.svg");
        background-size: cover
    }

    .i-partnered-content-small,.i-partnered-content-medium,.i-partnered-content-large {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/partnered-content-medium.svg);
        background-size: contain
    }

    .i-partnered-content-small {
        width: 12px;
        height: 12px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/partnered-content-small.svg)
    }

    .i-partnered-content-medium {
        width: 18px;
        height: 18px
    }

    .i-partnered-content-large {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/partnered-content-large.svg)
    }

    .i-copy {
        width: 18px;
        height: 18px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/copy.svg);
        background-size: contain
    }

    .i-download {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/download.svg);
        background-size: contain;
        margin-right: 0
    }

    .i-download-blue {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/marketplace/store/downloadblue.svg);
        background-size: contain;
        margin-right: 0
    }

    .i-gift {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/gift.svg);
        background-size: contain
    }

    .i-play-url {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/marketplace/store/playurl.svg);
        background-size: contain;
        margin-right: 0
    }

    .i-radio-checked,.i-radio-empty,.i-radio-checked-light {
        height: 24px;
        width: 24px;
        background-size: contain
    }

    .i-radio-checked {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/yes-no/radio-checked.svg)
    }

    .i-radio-checked-light {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/yes-no/radio-checked-light.svg)
    }

    .i-radio-empty {
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/yes-no/radio-empty.svg)
    }

    .i-three-dots {
        width: 24px;
        height: 24px;
        background-image: url(https://www.dndbeyond.com/content/1-0-3073-0/skins/waterdeep/images/icons/marketplace/store/ellipsisv.svg);
        background-size: contain;
        margin-right: 0
    }

}

.list-item-identifier.folder.avtt-drop-target:after,
.sidebar-panel-content.avtt-drop-target:after,
#track-list.avtt-drop-target:after {
    content: '';
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    box-shadow: inset 0px 0px 4px 1px #aaF;
    border: 1px #0000ff33 dotted;
    pointer-events: none;
}
.sidebar-panel-content.avtt-drop-target::after {
    top: 89px;
}
.grid-svg-tile {
  position: absolute;
  transform-origin: top left;
  top: 0;
  left: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;  
  background-repeat: repeat;
}
#VTT.hide-players *{
    visibility:hidden !important;
    pointer-events:none !important;
}

/***** Icon UI *****/

.mobileAVTTUI #VTTWRAPPER ~ div.ddbc-tab-options--layout-pill>button, 
.mobileAVTTUI #VTTWRAPPER ~ div.ddbc-tab-options--layout-pill>div,
.mobileAVTTUI #combat_tracker div.ddbc-tab-options--layout-pill>button{
    width: 30px !important;
    height: 30px !important;
    padding: 0px;
    margin: 0px 0px 3px 0px;
    font-size: 20px;
}
.mobileAVTTUI .drawbutton .button-text{
    display:none;
}
.mobileAVTTUI>div.ddbc-tab-options--layout-pill{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    top:38px !important;
}
.mobileAVTTUI  div.ddbc-tab-options--layout-pill>button#help_button{
    position:fixed;
    top:calc(100% - 30px) !important;
    left: 5px;
}
.mobileAVTTUI #combat_tracker div.ddbc-tab-options--layout-pill>button{
    position:fixed;
    top: 5px !important;
    left: 5px !important;
}
.mobileAVTTUI #peerVideo_switch {
    left: 35px !important;
    top:calc(100% - 30px) !important;
}
.mobileAVTTUI #peerVideo_switch .ddbc-tab-options__header-heading{
    text-indent: 200px;
    overflow:hidden;
    position:absolute;
    width:30px !important;
    height: 30px !important;
    margin: 0px 0px 0px 5px !important;
}
.mobileAVTTUI #peerVideo_switch .ddbc-tab-options__header-heading .button-icon{
    position: absolute;
    margin: 0 !important;
    font-size: 22px;
    text-indent: 0px;
    padding: 4px;
    top: 0px;
    left: 0px;
}

.mobileAVTTUI .top_menu{
    left: 30px !important;
    top: 5px !important;
    transition: none !important;
}
.mobileAVTTUI #bucket_menu{
    left:130px !important;
    top: 225px !important;
}
.mobileAVTTUI #combat_tracker_inside{
    left:40px;
    top: 7px;
}
.mobileAVTTUI #VTTWRAPPER ~ div.ddbc-tab-options--layout-pill>button:before, 
.mobileAVTTUI #VTTWRAPPER ~ div.ddbc-tab-options--layout-pill>div:before,
.mobileAVTTUI #combat_tracker div.ddbc-tab-options--layout-pill>button:before{
    font-family: 'Material Symbols Outlined';
    font-size: 22px;
    padding:4px;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    fill: #fff !important;
    display: block;
    height: 30px;
    width: 30px;
    text-indent: 0px;
    position:relative;
}
.mobileAVTTUI #select-button:before{
    content:"\f82f";        
}
.mobileAVTTUI #ruler_button:before{
    content:"\e41c";   
}
.mobileAVTTUI #fog_button:before{
    content:"\e818";   
}
.mobileAVTTUI #wall_button:before{
    content:"\e205";   
}
.mobileAVTTUI #elev_button:before{
    content:"\f6e7";   
}
.mobileAVTTUI #vision_button:before{
    content:"\f588";   
}
.mobileAVTTUI #draw_button:before{
    content:"\e746";   
}
.mobileAVTTUI #text_button:before{
    content:"\e262";   
}
.mobileAVTTUI #aoe_button:before{
    content:"\e57b";   
}
.mobileAVTTUI #help_button:before{
    content:"\e887";   
}   
.mobileAVTTUI #combat_button:before{
    content:"\f889";   
}

.mobileAVTTUI #zoom_buttons{
    display: flex;
    flex-direction: column-reverse !important;
    right: calc(var(--sidebar-width, 340px) + 2px) !important;
    top:26px;
    left:unset !important;
}

.body-rpgcharacter-sheet.mobileAVTTUI #zoom_buttons {
    top: 30px;
}

.avtt-spectator-sheet #zoom_buttons {
    top: 0px;
}
.avtt-spectator-sheet.mobileAVTTUI #zoom_buttons {
    top: 28px;
}

.avtt-spectator-sheet #hide_rightpanel,
.avtt-spectator-sheet.mobileAVTTUI #hide_rightpanel {
    top: 0px !important;
}

.mobileAVTTUI #zoom_buttons span,
.mobileAVTTUI #zoom_buttons svg{
    font-size: 22px !important;
    padding: 0px;
    margin: 0px !important;
}

.mobileAVTTUI #projector_zoom_lock span:nth-of-type(1){
    font-size: 16px !important;
}
.mobileAVTTUI #projector_zoom_lock span:nth-of-type(2){
    font-size: 38px !important;
}

.mobileAVTTUI #zoom_buttons .ddbc-tab-options--layout-pill{
    width:30px !important;
    height:30px !important;
}
.mobileAVTTUI #zoom_buttons .ddbc-tab-options--layout-pill>div{
    width:26px !important;
    height:26px !important;
}
.mobileAVTTUI #zoom_buttons svg{
    width:24px !important;
    height:22px !important;
}
.mobileAVTTUI #sheet_resize_button{
    left: -195px !important;
}

.js-popup-options {
    margin: 2px;
}
.js-popup-option {
    width: 100%;
    display: inline-flex;
    align-items: center;
    border: 1px;
    flex-wrap: wrap;
    font-family: Roboto Condensed,Roboto,Helvetica,sans-serif;
    cursor: pointer;
    color: #838383;
    line-height: 1;
    font-weight: 700;
    font-size: 12px;
    gap: 4px;    
    text-transform: uppercase;
    background-color: #f2f2f2;
    border-radius: 3px;
    padding: 5px 7px;
    margin: 1px;
    white-space: nowrap;
    background-image: unset;
}
.js-popup-decoration {
    width: 100%;
    display: block;
    font-family: Roboto Condensed,Roboto,Helvetica,sans-serif;
    color: black; 
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    background-color: #f2f2f2;
    margin: 1px;
    white-space: nowrap;
    background-image: unset;
    text-align: center;
    padding: 0;
    border: 0;
    border-top: 1px solid #ccc;
}
.js-popup {
    padding: 0;
    z-index: 10000000;
    position: absolute;
    width: fit-content;
    height: fit-content;
    margin: 0;
    border: none;
}
.js-popup form {
    margin: 0px;
    width: 120px;
}
.js-popup-option:hover {
    color: #f2f2f2;
    background-color: #5d5d5d;
}
.js-popup--is-active {
    color: #fff;
    background-color: #c53131;
}


@font-face {
  font-family: "Tiamat Condensed SC Regular";
  src: url("https://www.dndbeyond.com/fonts/tiamatcondensedsc-regular-webfont.woff2") format("woff2");
}
@font-face {
    font-family: "Roboto";
    src: url("https://www.dndbeyond.com/fonts/roboto-regular.woff2") format("woff2")
}

@font-face {
    font-family: "Roboto Condensed";
    src: url("https://www.dndbeyond.com/fonts/robotocondensed-regular-webfont.woff2") format("woff2")
}
@import url("//fonts.googleapis.com/css?family=Roboto+Condensed:400,700|Roboto:400,500,700|Gloria+Hallelujah:400,700");@font-face {
    font-family: 'Roboto Regular';
    src: url("https://www.dndbeyond.com/fonts/roboto-regular.woff2") format("woff2")
}

@font-face {
    font-family: 'Tiamat Condensed SC Regular';
    src: url("https://www.dndbeyond.com/fonts/tiamatcondensedsc-regular-webfont.woff2") format("woff2")
}

@font-face {
    font-family: 'Scala Sans Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansOffc-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: 'Scala Sans Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansOffc.ttf") format("truetype");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'Scala Sans Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansOffc-BoldIta.ttf") format("truetype");
    font-weight: bold;
    font-style: italic
}

@font-face {
    font-family: 'Scala Sans Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansOffc-Ita.ttf") format("truetype");
    font-weight: normal;
    font-style: italic
}

@font-face {
    font-family: 'Scala Sans SC Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansScOffc.ttf") format("truetype");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'Scala Sans SC Offc';
    src: url("https://www.dndbeyond.com/fonts/ScalaSansScOffc-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: 'MrsEavesSmallCaps';
    src: url("https://www.dndbeyond.com/fonts/MrsEavesSmallCaps.ttf") format("truetype");
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: 'DearSarahPro';
    src: url("https://www.dndbeyond.com/fonts/DearSarahPro.ttf") format("truetype");
    font-weight: 100;
    font-style: normal
}
/*** Combat tracker and note print styles ***/
@media print{

    body div.note.ui-dialog-content[id],
    body div.note-text{
        overflow: unset !important;
        display: block !important;
        position: relative !important;
        background: none !important;
        height:unset !important;
        border:none !important;
        max-height: unset !important;
    }
    body#site {
        overflow: auto !important;
    }
    
    #combat_area{
        border-collapse: separate !important;
        border-spacing: 5px 10px !important;
    }
    #combat_tracker_inside,
    #combat_tracker_inside .tracker-list{
        width:300px !important;
        overflow: unset !important;
        display: block !important;
        position: relative !important;
        background: none !important;
        height:unset !important;
        border:none !important;
    }  
    #combat_tracker_inside{
        display: flex !important;
        flex-direction: column-reverse !important;
    }
    #combat_footer{
        padding: 13px 4px 4px 4px !important;
    }
    #combat_area tr td:first-of-type,
    #combat_area tr td:nth-of-type(2)
    {
        width: unset !important;
    }
    #combat_area tr td:nth-of-type(4) {
        width: 5px !important;
    }
    #combat_area tr td:nth-of-type(3),
    #combat_area tr td:nth-of-type(5) {
        width: 68% !important;
    }
    #round_number_label{
        background: none !important;
        text-align:left !important;
        margin-left:15px !important;
    }
    #round_number_label:before,
    .hasTooltip.CTToken::after{
        display:none !important;
    }
    #combat_footer{
        display:none !important;
    }
    .tracker-list table{
        border-spacing: 5px 15px !important;
    }
    #combat_tracker_inside button{
        display:none !important;
        
    }  
}
/* hover for non-touch device */
@media (pointer: fine) {
    button[id$='-button']:hover,
    button[id$='_button']:hover,
    button[id^=peerVideo_]:hover,
    #combat_tracker > button:hover,
    body > button:hover,
    #addscene:hover,
    .scene button:hover,
    #combat_tracker_inside button:hover,
    #edit_dialog button:not(.rc-switch):hover,
    #edit_scene_form button:not(.rc-switch):hover,
    #mega_importer button:hover,
    #prewiz td button:hover,
    #wizard_popup button:hover,
    .top_menu button:hover,
    .monster_frame > button:hover,
    .stp-btn:hover,
    .player-actions button:hover,
    #add-party:hover,
    .importer_toggle:hover,
    #zoom_buttons button:hover,
    .GameLogEntry_Message__1GoY3 button:hover {
        color: #333;
        background-image: none;
        background: #e6e6e6;
    }
    
    .ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading:hover {
        background-color: #5d5d5d;
        color: #f2f2f2;
    }
    .ddbc-tab-options--layout-pill .ddbc-tab-options__header-heading.ddbc-tab-options__header-heading--is-active:hover {
        background-color: #c53131;
        color: #fff;
    }
    .material-icons.button-icon:hover {
        color: #fff;
    }
}
/* remove hover tooltips for touch devices */
@media (pointer: coarse) {
  .hasTooltip:not(.token)::after,
  .sidebar-hover-text-flyout{
    display:none;
  }
}