.imageRowStatisticStatBox,.toughnessTableRowItemValue,.actionDetailBody,.actionDetailBody2,.rotationConditionOperatorHeaderAbilityTriggerConditionHeader,.actionDetailBody2Description,.actionDetailBody2Detail,
.actionDetailBody2Preview {
    font-family: "Montserrat-Light";
}


.smallFont,.actionDetailBody,.actionDetailBodyCenterTags,.totalHealingValueBoss,.actionDetailBodyDetailExpandHeader,.buffShieldHealthValueDisplay,.actionDetailBodyBuffSource,.actionDetailBodyInner,
.traceContentBodyBoxRotations,.buffToughnessHealthValueDisplay,.turnOrderDisplayPreviewActionExpandRow,.analyticsResultRowDMG,.queryBarGainText,.characterDisplayEnemyLineupBarHeader,.filtersQuarterDescription,.filtersTagName,.filterTagsContainer,
.filtersQuarterDescriptionDarkRow,.importCharacterBoxHeader,.characterSearchButtonOptimize,.comboDebugWindow,.statsRowName,.traceContentBodyBoxRotationsWarning,.rowSummaryDMGNameAndPercentACTIONBAR,.rowSummaryDMGNameAndPercentACTIONBARGained,
.rowSummaryDMGNameAndPercentACTIONBARSpent,.statFiltersRowContainerSubstatsTrashRow,.imageRowStatisticNameBoxDMGDetails,.rotationConditionOperatorHeaderInlineParams,.eidolonRowNameTrigger,.traceToughnessTitleBoxToughnessRow,
.traitLevelDisplay,.imageRowStatisticStatBoxDETAILS,.characterDisplayPathNameBoxExtraEnemies,.enemyLinkerText,.regValueBlue {
    font-family: "Montserrat-Light";
}


div {
    color: white;
}

.turnOrderDisplayPreviewGREY {
    filter: grayscale(100%);
}

.updateBannerMegaBox {
    background-color: #111;
    grid-column: 2;
    grid-row: 1;
    border: 1px solid #434343;
    font-size: 15px;
    border-radius: 10px;
    box-sizing: border-box;
    margin-top: 5px;
    margin-bottom: 5px;
    white-space: normal;
    /* width: 50%; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.helpBarMegaBox {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    /* background-color: white; */
    /* border: 1px solid white; */
    height: auto;
}

.customMenuSearchNoteWarning {
    width: 95%;
    white-space: normal;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: 2px;
    margin-top: 2px;
    color: lightcoral;
}

.mainGridRow {
    display: flex;
    flex-direction: column;
    width: 100%;
    grid-column: 1 / span 3;
    grid-row: 4;
    border-radius: 10px;
    box-sizing: border-box;
    border: 2px solid #434343;

    background:
      linear-gradient(135deg, #1e1e1e, #0d0c0c 60%) top left,
      linear-gradient(-135deg, #1e1e1e, #0d0c0c 60%) top right,
      linear-gradient(45deg, #1e1e1e, #0d0c0c 60%) bottom left,
      linear-gradient(-45deg, #1e1e1e, #0d0c0c 60%) bottom right;
    background-color: #0d0c0c;
    background-size: 50% 50%, 50% 50%, 50% 50%, 50% 50%;
    background-repeat:  no-repeat, no-repeat, no-repeat, no-repeat;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
}


.blockoutBackgroundShutter {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 90%;
    z-index: 10000;
    display: none;
}
.customMenuMainHolderBox {
    position: fixed;
    z-index: 10100;
    width: 100%;
    max-width: 450px;
    height: auto;
    max-height: 80%;
    box-sizing: border-box;


    display: none;
    flex-direction: column;
    border-top-right-radius: 20px;
    box-sizing: border-box;
    border: 2px solid #434343;
    justify-content: top;
    align-items: center;
    /* overflow: hidden; */
    /* z-index: 1; */
}
.customMenuMainHolderBoxInner {
    z-index: 10100;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    position: relative;


    /* display: none; */
    flex-direction: column;
    border-top-right-radius: 20px;
    box-sizing: border-box;
    /* border: 2px solid #434343; */

    background: linear-gradient(200deg, transparent,transparent,#0d393b3d);

    /* background:
      linear-gradient(135deg, #1e1e1e, #0d0c0c 60%) top left,
      linear-gradient(-135deg, #1e1e1e, #0d0c0c 60%) top right,
      linear-gradient(45deg, #1e1e1e, #0d0c0c 60%) bottom left,
      linear-gradient(-45deg, #1e1e1e, #0d0c0c 60%) bottom right; */
    background-color: #0d0c0c;
    /* background-size: 50% 50%, 50% 50%, 50% 50%, 50% 50%; */
    /* background-repeat:  no-repeat, no-repeat, no-repeat, no-repeat; */
    justify-content: top;
    align-items: center;
    overflow-y: auto;
    /* overflow: hidden; */
    /* z-index: 1; */
}

.customMenuMainHolderBox::before {
    content: "";
    position: absolute;
    inset: 0.5%;
    border-top-right-radius: 20px;
    border: 2px solid #1e9a9e;
    z-index: 10099;
    transform: translate(-18px, 21px); 
}
.customMenuTitleRow {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    position: relative;
    min-height: 40px;
}
.customMenuSearchTitleHolder {
    width: 100%;
    overflow: hidden;
    position: relative;
}
.customMenuSearchTitle {
    width: 100%;
    font-size: 40px;
    padding-left: 15px;
    display: flex;
    justify-content: left;
    align-items: center;
}
.customMenuCloseButton {
    position: absolute;
    right: 0px;
    top: 0;
    /* transform: translateY(-50%); */
    font-size: 18px;
    color: #1e9a9e;
    /* color: #434343; */
    border: 2px solid #434343;
    /* border: 2px solid #1e9a9e; */
    border-top: none;
    border-right: none;
    padding: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom-left-radius: 10px;
}
.customMenuCloseButton:hover {
    color: white;
    background-color: #ffffff80;
}
.customMenuSearchBarBox {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2px;
    margin-bottom: 2px;
}


.helpBarMegaBox {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    /* background-color: white; */
    /* border: 1px solid white; */
    height: auto;
}

.clickable {
    cursor: pointer;
}




.eventBodyMainBox {
    width: 100%;
    display: flex;
    /* flex-direction: column; */
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;
    padding-left: 2px;
    padding-right: 2px;
    color: white;
}
/* .parsingMainHolder {
    width: 100%;
    box-sizing: border-box;
} */

.eventCharacterFileHeader {
    /* width: 100%; */
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    /* margin-left: 5px;
    margin-top: 5px; */
    margin: 5px;
    /* max-width: 250px; */
}
.eventCharacterFileIcon {
    z-index: 1;
    /* width: 90px; */
    height: 250px;
    width: auto;
    margin-right: 10px;
    margin-left: 10px;

    border: 2px solid white;
    /* border-radius: 50%; */
    background-color: black;
    box-sizing: border-box;
    border-radius: 5px;
}

.eventCharacterFileIconRelic {
    z-index: 1;
    /* width: 90px; */
    height: 100px;
    width: auto;
    margin-right: 10px;
    margin-left: 10px;

    border: 2px solid white;
    /* border-radius: 50%; */
    background-color: black;
    box-sizing: border-box;
    border-radius: 5px;
}
.eventCharacterFileInfoBox {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding-left: 2px;
    padding-right: 2px;
    color: white;
}
.eventCharacterFileInfoBoxEnemies {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding-left: 2px;
    padding-right: 2px;
    color: white;
}
.enemyMainStatsBoxScalarOverview {
    width: 100%;
    display: flex;
    box-sizing: border-box;
    justify-content: space-evenly;
    align-items: center;
}
.selectorWidthRestriction {
    width: 100%;
}
.selectorWidthRestrictionEnemies {
    width: 100%;
    max-width: 300px;
}
.characterDisplayPathAndNameBox {
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    box-sizing: border-box;
    background-color: #c0c1d633;
}

.mainBodyRowOrColumn {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    /* justify-content: ; */
}
.mainBodyRowOrColumnRow {
    width: 100%;
    height: 100%;
    display: flex;
    /* flex-direction: column; */
    box-sizing: border-box;
    /* justify-content: ; */
}


.imageRowStatisticBoxWithIcon {
    /* width: 100%; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* height: 25px; */
    height: auto;
    /* padding-left: 10px; */
    box-sizing: border-box;
}



.imageRowStatisticBox1,.imageRowStatisticBox2,.imageRowStatisticBoxMain,.imageRowStatisticBox1DETAILS,.imageRowStatisticBox2DETAILS {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 25px;
    height: auto;
    /* padding-left: 10px; */
    box-sizing: border-box;
}
.imageRowStatisticBox1DETAILS,.imageRowStatisticBox2DETAILS {
    justify-content: center;
    align-items: center;
    padding-left: 4px;
    padding-right: 4px;
    flex-direction: column;
    display: flex;
    width: auto;
    box-sizing: border-box;
    height: 50px;
    /* background-color: none;
    background: none; */
}
.imageRowStatisticBox1,.imageRowStatisticBox1DETAILS {
    background-color: #c0c1d60D;
}
.imageRowStatisticBoxEnemyAdjustmentRow {
    justify-content: space-between;
    padding: 5px;
}

.imageRowStatisticNameBoxDETAILS,.imageRowStatisticStatBoxDETAILS {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.imageRowStatisticNameBoxDETAILSWithIcon {
    /* width: 100%; */
    display: flex;
    justify-content: center;
    align-items: center;
}
.imageRowStatisticNameBoxDETAILS + .imageRowStatisticStatBoxDETAILS {
    border-top: 2px solid grey;
}

.imageRowStatisticNameBox,.imageRowStatisticNameBoxMain,.imageRowStatisticNameBoxFilterRow,.imageRowStatisticNameBoxDMGDetails {
    width: 60%;
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 2px;
    font-size: 14px;
}

.imageRowStatisticStatBox {
    /* width: 30%; */
    display: flex;
    justify-content: right;
    align-items: center;
    padding-right: 2px;
    font-size: 14px;
}
.imageRowStatisticStatBoxEnemyPhased {
    display: flex;
    justify-content: right;
    align-items: center;
    padding: 5px;
    margin: 5px;
    font-size: 20px;
}
.imageRowStatisticStatBoxPhased {
    /* width: 30%; */
    display: flex;
    justify-content: right;
    align-items: center;
    /* padding-right: 2px; */
    margin: 3px;
    font-size: 25px;
}


.imageRowStatisticStatBox2 {
    width: 30%;
    display: flex;
    justify-content: right;
    align-items: center;
    padding-right: 2px;
    font-size: 18px;
}


.toughnessTableRowBox {
    /* width: 100%;
    max-width: 300px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.toughnessTableRowHeader {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.toughnessTableRowTableRow {
    /* width: 100%; */
    margin-left: 15px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;
}

.toughnessTableRowItemBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 33%;
}
.toughnessTableRowItemBox + .toughnessTableRowItemBox {
    margin-left: 10px;
}
.toughnessTableRowItemHeader {
    border-bottom: 2px solid #434343;
}

.eventBodyScrollerMain {
    width: 100%;
    height: 100%;
    /* min-height: 100%; */
    /* max-height: 95%; */
    max-height: 850px;
    overflow-y: auto;
    box-sizing: border-box;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #0d0c0cb7;
    border-radius: 5px;
}



.rotationsConditionsBodyBox {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: left;
    box-sizing: border-box;
    flex-direction: column;
    padding-left: 2px;
    margin-top: 4px;
    margin-bottom: 4px;
    /* border: 1px solid yellow; */
}
.rotationConditionOperatorBox {
    width: 100%;
    padding-left: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: left;
    flex-direction: column;

    /* border: 1px solid red; */
    /* border-left: 2px solid rgba(255, 255, 255, 0.527); */
    border-bottom-left-radius: 10px;
}
.rotationConditionOperatorBoxMain {
    width: 100%;
    padding-left: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: left;
    flex-direction: column;

    /* border: 1px solid red; */
    border-left: 2px solid rgba(255, 255, 255, 0.527);
    border-bottom-left-radius: 10px;
}
.rotationConditionOperatorBoxMainAttack {
    width: 100%;
    padding-left: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: left;
    align-items: left;
    flex-direction: column;

    /* border: 1px solid red; */
    border-left: 2px solid rgba(255, 255, 255, 0.527);
    border-bottom-left-radius: 10px;
}

.rotationConditionOperatorHeaderAbilityTrigger {
    width: 100%;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 3px;
    box-sizing: border-box;

    /* background-color: rgba(255, 255, 255, 0.082); */
}
.rotationConditionOperatorHeaderAbilityTriggerConditionHeader {
    width: 100%;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
    box-sizing: border-box;

    border-left: 2px solid rgba(255, 255, 255, 0.527);
    /* border-top-left-radius: 10px; */

    background:
        linear-gradient(rgba(255, 255, 255, 0.527) 0 0) top 0 left / calc(5% - 40px) 2px no-repeat,
        linear-gradient(rgba(255, 255, 255, 0.527) 0 0) bottom 0 left / calc(5% - 40px) 2px no-repeat;

    /* outline: 2px solid rgba(255, 255, 255, 0.527);
    outline-offset: -10px; */

    /* background-color: rgba(255, 255, 255, 0.082); */
}
.rotationConditionOperatorHeaderCondition,.rotationConditionOperatorHeaderConditionEnemy {
    /* width: 100%; */
    width: fit-content;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    /* text-align: left; */
    padding-left: 5px;
    padding-right: 5px;
    margin-right: 3px;
    box-sizing: border-box;
    background-color: rgba(255, 255, 255, 0.212);
}
.rotationConditionOperatorHeaderConditionEnemy {
    font-size: 24px;
}
.rotationConditionOperatorHeaderConditionTriggerRow {
    /* width: 100%; */
    width: fit-content;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    /* text-align: left; */
    padding-left: 3px;
    padding-right: 5px;
    box-sizing: border-box;
    color: black;
    background-color: rgba(255, 255, 255, 0.842);
    border-top-right-radius: 10px;
}

.rotationConditionOperatorHeaderConditionTHEN {
    /* width: 100%; */
    width: fit-content;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 5px;
    padding-right: 5px;
    box-sizing: border-box;
    /* background-color: rgba(255, 255, 255, 0.212); */
    background-color: rgba(40, 139, 0, 0.212);
}
.rotationConditionOperatorHeaderConditionELSE {
    /* width: 100%; */
    width: fit-content;
    font-size: 18px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 5px;
    padding-right: 5px;
    box-sizing: border-box;
    background-color: rgba(235, 0, 0, 0.212);
}
.rotationConditionOperatorHeader {
    /* width: 100%; */
    font-size: 16px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
}
.rotationConditionOperatorHeaderInlineParams {
    /* width: 100%; */
    font-size: 14px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
}
.crossThroughText {
    text-decoration: line-through;
}
.crossThroughTextFaded {
    color: rgb(107, 107, 107);
}
.rotationConditionOperatorHeaderInlineParamsExtraEffectHeader {
    /* width: 100%; */
    font-size: 16px;
    margin-bottom: -5px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    color: rgb(202, 202, 202);
    border-bottom: 1px solid rgba(255, 255, 255, 0.281);
}
.actionDetailBody3Description {
    width: 100%;
    white-space: normal;
    text-align: left;
    color: #808080;
    box-sizing: border-box;
}
.rotationConditionOperatorHeaderInline {
    /* width: 100%; */
    font-size: 14px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
}
.rotationConditionOperatorHeaderMini {
    width: 100%;
    font-size: 14px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
}

.actionDetailBody {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
.actionDetailBody2 {
    /* width: 100%; */
    width: auto;
    /* width: 100%; */
    width: fit-content;
    display: flex;
    justify-content: left;
    /* flex-direction: column; */
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* background-color: rgba(255, 255, 255, 0.021); */
    /* background-color: rgba(0, 0, 0, 0.274); */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
.actionDetailBody2BattleEventOverrides {
    /* width: 100%; */
    /* width: auto; */

    /* width: 100%; */
    width: auto;
    /* width: 250px; */
    max-width: 500px;
    display: flex;
    flex-direction: column;
    justify-content: left;
    /* flex-direction: column; */
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* background-color: rgba(255, 255, 255, 0.021); */
    /* background-color: rgba(0, 0, 0, 0.274); */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
.actionDetailBody2Preview {
    /* width: 100%; */
    width: auto;
    /* width: 100%; */
    width: fit-content;
    /* display: flex; */
    justify-content: left;
    /* flex-direction: column; */
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* background-color: rgba(255, 255, 255, 0.021); */
    /* background-color: rgba(0, 0, 0, 0.274); */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
.actionDetailBody2Detail {
    /* width: 100%; */
    width: auto;
    width: fit-content;
    /* display: flex; */
    justify-content: left;
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* background-color: rgba(255, 255, 255, 0.021); */
    /* background-color: rgba(0, 0, 0, 0.274); */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
.actionDetailBody2DetailTargetNaming {
    /* width: 100%; */
    /* width: auto; */
    /* width: fit-content; */
    /* display: flex; */
    justify-content: left;
    align-items: center;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    position: relative;
    font-size: 14px;

    /* background-color: rgba(255, 255, 255, 0.021); */
    /* background-color: rgba(0, 0, 0, 0.274); */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


    /* flex-wrap: wrap; */
    /* border: 1px solid red; */
}
/* .actionDetailBody2Description {
    width: auto;
    width: fit-content;
    display: flex;
    flex-wrap: wrap;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    position: relative;
    font-size: 14px;

    background: linear-gradient(to right, rgba(255, 255, 255, 0.048),transparent, rgba(0, 0, 0, 0.274));


} */
.actionDetailBody2Description {
    width: 100%;
    white-space: normal;
    text-align: left;
    color: #18fcc7ce;
    box-sizing: border-box;
}

.descriptionNumberColor {
    color: #dd9337;
}
.descriptionFunctionColor {
    color: #DCDC9D;
}

.targetFunction {
    color: #DCDC9D;
    border-bottom: 1px solid #dcdc9d4b;
    cursor: pointer;
    text-decoration: none;
}
.targetNaming {
    /* color: #C3915B;
    border-bottom: 1px solid #c3915b34; */
    /* width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: normal; */

    color: #9CDCFE;
    border-bottom: 1px solid #9cdcfe48;
    text-decoration: none;

    cursor: pointer;
}

.targetFunction:hover, .targetNaming:hover {
    opacity: 0.5;
}



.rotationsSectionRowHolder {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 10px;
    margin-top: 3px;
    margin-bottom: 3px;
    overflow: hidden;

    /* background: linear-gradient(190deg, #0d393b7a,transparent,transparent,#ffffff21); */
    background: linear-gradient(340deg, #ffffff21,transparent,transparent,#0d393b7a);
}


.rotationsSectionRowHolder1, .rotationsSectionRowHolder1Overview {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-items: stretch;

    box-sizing: border-box;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 10px;
    margin-top: 3px;
    margin-bottom: 3px;
    overflow: hidden;

    /* background: linear-gradient(190deg, #0d393b7a,transparent,transparent,#ffffff21); */
    background: linear-gradient(340deg, transparent,transparent,transparent,#ffffff21);
}
.rotationsSectionRowHolder2, .rotationsSectionRowHolder2Overview {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-items: stretch;
    box-sizing: border-box;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 10px;
    margin-top: 3px;
    margin-bottom: 3px;
    overflow: hidden;

    /* background: linear-gradient(190deg, #0d393b7a,transparent,transparent,#ffffff21); */
    background: linear-gradient(340deg, transparent,transparent,transparent,#0d393b7a);
}

.rotationsSectionRowHolder3, .rotationsSectionRowHolder3Overview,.enemySummaryDataBoxMain {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 10px;
    margin-top: 3px;
    margin-bottom: 3px;
    overflow: hidden;

    /* background: linear-gradient(190deg, #0d393b7a,transparent,transparent,#ffffff21); */
    background: linear-gradient(340deg, transparent,transparent,transparent,#0000007a);
}


.enemyWaveEnemyDisplayBoxWideEnemy {
    width: 40%;
    max-width: 200px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    /* border: 1px solid red; */
    border-top-right-radius: 10px;
    padding: 2px;
    backdrop-filter: blur(5px);
    margin: 10px;
    /* background: linear-gradient(200deg, #ffffff21,transparent,#0d393b7a); */
    background: linear-gradient(200deg, #0d393b7a,transparent,#ffffff21);

    background: linear-gradient(200deg, #0d393b,transparent,#ffffff21);
    border: 1px solid #acacaca9;
    /* background: linear-gradient(200deg, #ffffff21,transparent, #0d393b7a); */
}



.rotationsSectionRowHolder2Overview, .rotationsSectionRowHolder1Overview {
    padding: 5px;
}

.rotationsConditionsBodyBox1 {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: left;
    box-sizing: border-box;
    flex-direction: column;
    padding-left: 2px;
    margin-top: 4px;
    margin-bottom: 4px;
    /* border: 1px solid yellow; */

    background: linear-gradient(340deg, transparent,transparent,transparent,#ffffff21);
}
.rotationsConditionsBodyBox2 {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: left;
    box-sizing: border-box;
    flex-direction: column;
    padding-left: 2px;
    margin-top: 4px;
    margin-bottom: 4px;
    /* border: 1px solid yellow; */

    background: linear-gradient(340deg, transparent,transparent,transparent,#0d393b7a);
}


.isConditionContainer {
    border-left: 2px solid rgba(255, 255, 255, 0.527);
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom: none;
    border-top: none;
}

.isConditionContainerBox {
    /* width: 100%; */
    display: flex;
    justify-content: left;
    align-items: center;
    box-sizing: border-box;
    padding-left: 2px;
}

.modifierDetailsBox {
    margin-left: 15px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: left;
    justify-content: flex-start;
}

.modifierDetailsBoxAttackModification {
    display: flex;
    justify-content: center;
    align-items: left;
}



.rotationsPermaConditionsExpand {
    width: 100%;
    display: flex;
    flex-direction: column;

    justify-content: center;
    align-items: left;
    text-align: left;
    box-sizing: border-box;
    padding: 5px;
    white-space: normal;
    /* border: 1px solid green; */

}


.characterDisplayLogStatIconCenter {
    width: 40px;
    height: 40px;
    object-fit: contain;
    position:relative;
    justify-content: center;
    /* border: 1px solid green; */
    transform: none;
    bottom: 0;
    position: relative;
    /* margin-right: -5px; */
    margin-left: -5px;
    /* padding: 5px; */
    /* background-color: #c0c1d60D; */
}

.characterDisplayLogStatIcon {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    height: auto;
    width: 50px;
    max-width: 50px;
    /* position:absolute; */
    /* right: 0;
    bottom: 50%; */
    /* transform: translateY(50%); */
    /* border: 1px solid green; */
}
.characterDisplayLogStatIconElement {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    height: auto;
    width: 30px;
    max-width: 30px;
    margin-left: 10px;
    margin-right: 5px;
    /* position:absolute; */
    /* right: 0;
    bottom: 50%; */
    /* transform: translateY(50%); */
    /* border: 1px solid green; */
}


.ImaginaryDMGColoring {
    background: linear-gradient(to bottom,#F4DF33,#FFF79E);
}
.FireDMGColoring {
    background: linear-gradient(to bottom,#E52A2A,#FD8B6A);
}
.IceDMGColoring {
    background: linear-gradient(to bottom,#2691D4,#BCF4FE);
}
.PhysicalDMGColoring {
    background: linear-gradient(to bottom,#C3C3C3,#EDEDED);
}
.QuantumDMGColoring {
    background: linear-gradient(to bottom,#5048BE,#C7C7FB);

    /* background: linear-gradient(to right, #5048BE,transparent, #C7C7FB); */
}
.LightningDMGColoring {
    background: linear-gradient(to bottom,#B64CD6,#E98AFE);
}
.WindDMGColoring {
    background: linear-gradient(to bottom,#40C389,#BAEABD);
}



.trueDMGColoring {
    background: linear-gradient(to bottom,#CDDDFE,#F9CCF4);
}
/* ORDER FUCKIN MATTERS HERE */


.dmgTypeColoring,
.trueDMGColoring,.ImaginaryDMGColoring,.FireDMGColoring,.IceDMGColoring,.PhysicalDMGColoring,
.QuantumDMGColoring,.LightningDMGColoring,.WindDMGColoring {
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: bold;
    display: inline-block;

    /* background-color: black; */
}

.booleanBlue {
    color: #368CD6;
}
.regValueBlue {
    /* color: #7bd0fd; */
    /* color: #9CDCFE; */

    /* color: rgb(182, 226, 202); */

    /* color: #7bcffdb9; */
    /* color: #9cdcfee3; */
}
.regValueBlue2 {
    color: #9CDCFE;
}







/* .turnStarterBarAlly, .turnStarterBarEnemy, .turnStarterBarUltimate, .turnStarterBarMiniAction, .turnStarterBarMiniActionEnemy {
    width: 100%;
    min-height: 50px;
    max-height: 50px;
    border: 2px solid #5f656b;
    border-left: 2px solid #03dbd1;
    box-sizing: border-box;
    font-size: 16px;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: center;
    margin-top: 3px;
    margin-bottom: 3px;
    border-top-right-radius: 12px;
    position: relative;
    overflow: hidden;
    background-color: black;
} */

.turnOrderDisplayPreview, .turnOrderDisplayPreviewEnemyGlorp, .turnOrderDisplayPreviewUltimate, .turnOrderDisplayPreviewUltimateSummon .turnOrderDisplayPreviewEventIcon, .turnOrderDisplayPreviewEventAction {
    height: 100%;
    /* max-height: 100%; */
    width: auto;
    /* max-width: 100%; */
    object-fit: contain;
    scale: 4;
    transform:translate(20%,20%);
    mask-image: linear-gradient(to right, black 70%, transparent 100%);
    box-sizing: border-box;
}
.turnOrderDisplayPreview {
    /* transform:translate(-20%,5%);
    scale: 0.5; */
    /* object-fit: none; */
    /* scale: 3.7; */
    height: 100px;
    width: auto;
    scale: 1;
    transform:translate(10%,00%);
    margin-right: 15px;
    /* background-color: white; */
}








.triggerAbilityButtonHolderRow {
    width: 100%;
    display: flex;
    box-sizing: border-box;
}



.characterSearchButtonDMGDetails {
    /* font-size: 20px;
    width: 40%;
    box-sizing: border-box;
    border-radius: 15px;
    background-color: #e1e1e4;
    border: 1px solid #cacacc;
    outline: 1px solid #e1e1e4;
    padding-left: 5px;
    padding-right: 5px;
    color: #121212;
    margin: 2px;
    opacity: 0.5; */

    font-size: 18px;
    width: auto;
    box-sizing: border-box;
    border-radius: 15px;
    /* background-color: #121212;
    border: 1px solid #cacacc80;
    outline: 1px solid #e1e1e480;
    padding-left: 6px;
    padding-right: 6px;
    color: white; */

    background-color: white;
    border: 1px solid #cacacc80;
    outline: 1px solid #e1e1e480;
    padding-left: 6px;
    padding-right: 6px;
    color: black;

    margin: 2px;
    margin-right: 4px;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.characterSearchButtonDMGDetails:hover {
    opacity: 0.5;
}




.superimpositionHolderbox {
    width: 100%;
    /* background-color: #e1e1e4; */
    color: black;
    border-radius: 10px;
    margin-top: 5px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;
    /* border: 2px solid #e1e1e4; */
    overflow: hidden;
}
.superimpositionButton {
    width: 20%;
    color: #e1e1e4;
}
.superimpositionButton + .superimpositionButton {
    border-left: 1px solid #e1e1e4;
}


.rightDescriptionBox {
    width: 100%;
    white-space: normal;
    text-align: left;
    color: #18fcc8;
    box-sizing: border-box;
}

.customMenuSearchNote {
    /* width: 95%;
    max-width: 250px; */
    width: 100%;
    white-space: normal;
    /* display: flex; */
    justify-content: left;
    /* align-items: center; */
    font-size: 12px;
    text-align: left;
    box-sizing: border-box;
    margin-bottom: 2px;
    margin-top: 2px;
    color: #93CCEA;
    padding: 5px;
}






.libraryCharacterDataHeaderBox {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    /* padding: 5px; */

}

.libraryCharacterDataHeader {
    width: 100%;
    height: 100%;
    display: flex;
    /* flex-direction: column; */
    justify-content: left;
    align-items: center;
    box-sizing: border-box;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.199);

}

.libraryCharacterDataHeaderCharNameBox {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    /* background-color: rgba(0, 0, 0, 0.486); */
    /* padding-left: 10px; */
}
.libraryCharacterDataHeaderCharName {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: center;
    box-sizing: border-box;
    /* font-size: 55px; */
    padding-left: 10px;
}
.libraryCharacterDataHeaderCharNameInner,.libraryCharacterDataHeaderCharNameInnerEnemies {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: center;
    box-sizing: border-box;
    font-size: 55px;

    white-space: normal;
    /* padding-left: 10px; */
}
.libraryCharacterDataHeaderCharNameInnerEnemies {
    font-size: 45px;
}
.noParamsPassedWarningBox {
    width: 90%;
    display: none;
    align-items: center;
    justify-content: center;
    color: lightcoral;
    font-size: 14px;
    white-space: normal;
    box-sizing: border-box;
}

.enemyMainStatsBox {
    width: 100%;
    max-width: 250px;
    box-sizing: border-box;
    border: 1px solid #acacaca9;
    border-top-right-radius: 15px;

    background: linear-gradient(340deg, transparent,transparent,transparent,#0d393b7a);
}

.characterDisplayElementBox {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    box-sizing: border-box;
}

.characterDisplayElement {
    width: 50px;
    height: auto;
    object-fit: contain;
    box-sizing: border-box;
}

.characterDisplayPathAndNameBoxRowHolder, .characterDisplayPathAndNameBoxRowHolderStars {
    width: 100%;
    height: 29px;
    display: flex;
    justify-content: left;
    align-items: center;
    /* padding-left: 25px; */
    position: relative;
    box-sizing: border-box;
    padding-bottom: 7px;
}
.characterDisplayPathAndNameBoxRowHolderStars {
    padding: 0;
}
.characterDisplayPathAndNameBox {
    width: 100%;
    /* width: fit-content; */
    /* max-width: 350px; */
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 2px;
    padding-top: 2px;
    padding-bottom: 2px;
    /* border-top-right-radius: 10px; */
    /* padding-right: 50px; */
    box-sizing: border-box;

    /* position: absolute;
    left: 5%; */


    /* background: linear-gradient(to right, #c0c1d633, #c0c1d633, #c0c1d633, transparent); */

    background-color: #c0c1d633;
}

.characterDisplayPathAndNameBoxExtra {
    width: 100%;
    width: fit-content;
    max-width: 350px;
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    border-top-right-radius: 10px;
    padding-right: 50px;
    box-sizing: border-box;

    position: absolute;
    left: 5%;


    background: linear-gradient(to right, #c0c1d633, #c0c1d633, #c0c1d633, transparent);

    /* background-color: #c0c1d633; */
}

.characterDisplayPathNameBox {
    font-size: 16px;
    /* margin-left: 5px; */
    box-sizing: border-box;
}
.characterDisplayPathNameBoxExtra {
    font-size: 20px;
    margin-left: 5px;
    box-sizing: border-box;
}
.characterDisplayPathNameBoxExtraEnemies {
    font-size: 20px;
    /* margin-left: 5px; */
    box-sizing: border-box;
}
.characterDisplayPathImageBox {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.characterDisplayPathImage {
    width: 25px;
    height: auto;
    box-sizing: border-box;
}




.enemyConfigSummonRow {
    width: 100%;
    margin: 10px;
    /* margin-left: 15px; */
    padding: 5px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    height: auto;


    background-color: rgba(0, 0, 0, 0.219);

}
.enemyWaveEnemyDisplayBox {
    width: 10%;
    min-width: 120px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    /* border: 1px solid red; */
    border-top-right-radius: 10px;
    padding: 2px;
    backdrop-filter: blur(5px);
    /* min-height: 200px; */
    /* background: linear-gradient(200deg, #ffffff21,transparent,#0d393b7a); */
    background: linear-gradient(200deg, #0d393b7a,transparent,#ffffff21);

    background: linear-gradient(200deg, #0d393b,transparent,#ffffff21);
    border: 1px solid #acacaca9;
    text-decoration: none;
    /* background: linear-gradient(200deg, #ffffff21,transparent, #0d393b7a); */
}
.enemyWaveEnemyDisplayBox:hover {
    opacity: 0.5;
}
.enemyWaveSummaryHolder {
    min-height: 200px;
}
.enemyWaveSummaryHolder {
    width: 100%;
    justify-content: space-evenly;
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    /* margin-top: 10px;
    margin-bottom: 10px; */
}

.enemyWaveSummaryHolderEnemy {
    min-height: 200px;
}
.enemyWaveSummaryHolderEnemy {
    width: 100%;
    min-width: 100%;
    /* min-width: 500px; */
    justify-content: space-evenly;
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    /* margin-top: 10px;
    margin-bottom: 10px; */
}

.enemyWaveEnemyIcon {
    height: auto;
    width: 100%;
    object-fit: contain;
    box-sizing: border-box;
    margin-bottom: -50px;
}
.enemyLinkerText {
    white-space: normal;
}
.enemyWaveEnemyDisplayBoxIDLinker {
    width: 100%;
    height: 100%;
    /* color: transparent; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* backdrop-filter: blur(5px); */
    /* background-color: rgba(0, 0, 0, 0.219); */
    /* position: absolute; */
    /* z-index: 5; */
    /* display: none; */
    flex-direction: column;
    overflow: hidden;
    text-decoration: none;
    color: white;

}
/* .enemyWaveEnemyDisplayBoxIDLinker {
    display: flex;
} */



.actionDetailHeaderRowCharacterImage {
    height: 150%;
    /* width: auto; */
    object-fit: contain;
    /* transform: translateY(15%) scale(0.85); */
    /* transform: scale(0.90); */
    /* border: 1px solid red; */
    box-sizing: border-box; 
    position: absolute;
    left: 0;
    top: 0;
    mask-image: linear-gradient(to right, black 70%, transparent 100%);
}

.actionDetailHeaderRowCharacterImageAndEnergyBox {
    width: 100%;
    max-width: 225px;
    height: 100%;
    height: 200px;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    /* border: 1px solid green; */
}



.menuSwitcherBarTopBox {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    /* border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px; */
    /* border: 2px solid #434343; */
    border-top: none;
    margin: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}


.menuSwitcherButtonTop {
    padding-top: 10px;
    padding-bottom: 10px;
    width: auto;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-left: 20%;
    font-size: 25px;
    position: relative;
    z-index: 1;
    opacity: 0.75;
    padding-left: 6px;
    padding-right: 6px;
    margin-right: 5px;
    margin-left: 5px;
}
.menuSwitcherButtonTop + .menuSwitcherButtonTop {
    /* border-left: 2px solid #434343; */
}
.menuSwitcherButtonTop:hover {
    background: #ffffff1A;
}



.eventReaderControlsBox {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: left;
    align-items: center;
    padding-left: 4px;
    padding-right: 4px;
}
.eventReaderControlsBoxTrimRow {
    width: 26%;
    display: flex;
    flex-direction: column;
    justify-content: left;
    align-items: center;
    padding-left: 4px;
    padding-right: 4px;
}
.energyAndToughnessRowHolder {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.energyAndToughnessRowHolderItems {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

.lighconeStarRatingRow {
    height: 25px;
    width: auto;
    /* max-height: 15px; */
    /* min-height: 20px; */
    object-fit: contain;
    position: absolute;
    bottom: 1%;
    left: 50%;
    transform: translateX(-50%);
    backdrop-filter: blur(5px);
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0.295);

}



/* .cardBoxIconText,.cardBoxIconTextVersion {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.562);
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 2%;
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 3px;
    border-radius: 3px;
    overflow: hidden;
    flex-direction: column;
    backdrop-filter: blur(5px);
} */



.expandedDataHolderHolderBox {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    /* border: 1px solid #434343; */
    box-sizing: border-box;
}
.characterMainCenterDisplay,.characterMainCenterDisplayEnemies {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    flex-direction: column;
    /* overflow: hidden; */
}
.characterMainCenterDisplayEnemies {
    padding: 10px;
}

.centerDisplayHolderBox {
    width: 100%;
    height: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid#e1e1e4;
    border-top: 1px solid#e1e1e4;
    border-radius: 10px;
}

.traceMainBoxHolder {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    object-fit: cover;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    /* border: 1px solid white; */
    /* outline: 1px solid white; */
    /* outline-offset: -15px; */
    /* border-radius: 50%; */
    aspect-ratio: 1/1;
    max-width: 600px;
    /* overflow: hidden; */
}

.centerDisplayHolderBoxTraceSummary {
    /* width: 100%; */
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;

    position: absolute;
    left: 2%;
    bottom: 2%;

}


.expandedMiddle {
    width: 70%;
    height: 725px;
    box-sizing: border-box;
}
.expandedMiddleNoQuarters {
    width: 100%;
    height: 725px;
    box-sizing: border-box;
}

.expandedQuarters {
    width: 20%;
    height: 500px;
    min-width: 250px;
    /* border-right: 1px solid #434343;
    border-left: 1px solid #434343; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    /* position: relative; */
    /* padding: 2px; */
    z-index: 1;
}
.quartersBackgroundTransparent {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: black;
    opacity: 0.9;
    z-index: 0;
    display: none;
}

.characterBasicMenuStatsBox {
    width: 100%;
    max-width: 500px;
    height: auto;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    position: relative;
    backdrop-filter: blur(5px);
    background: #1e1e1ea6;
    border-radius: 10px;
}


.abilitySelectorFloaterBox {
    width: 100%;
    max-width: 300px;
    box-sizing: border-box;
    border: 2px solid #434343;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.abilitySelectorFloaterBoxEnemies {
    width: 100%;
    /* max-width: 300px; */
    box-sizing: border-box;
    /* border: 2px solid #434343; */
    /* border-radius: 10px; */
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-top: 10px;
    margin-bottom: 10px;
}

.abilitySelectorFloaterBoxName {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
}
.abilitySelectorFloaterBoxNameEnemies {
    /* width: 100%; */
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    margin-right: 5px;
    margin-left: 5px;
}


.traceTypeDisplayBox {
    width: 100%;
    display: flex;
    justify-content: left;
    align-items: center;
    margin-top: 2px;
    margin-bottom: 2px;
}

.traceTypeDisplay {

    font-size: 18px;
    width: auto;
    box-sizing: border-box;
    border-radius: 15px;
    color: #121212;
    padding-left: 5px;
    padding-right: 5px;
    /* color: #e1e1e4; */
    background-color: #ffffff;
    margin: 2px;
    opacity: 1;
}

.traceToughnessBox {
    background-color: #cacacc1A;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin-bottom: 2px;
    margin-top: 3px;
}
.traceToughnessBoxOverviewSkill {
    max-width: 200px;
    background-color: #cacacc1A;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin-bottom: 2px;
    margin-top: 3px;
}
.traceLevelBox {
    /* background-color: #cacacc1A; */
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin-bottom: 2px;
}
.traceToughnessTitleBox {
    width: 100%;
    height: 100%;
    justify-content: left;
    align-items: center;
    color: #dde0e2;
    text-align: left;
    padding-left: 4px;
}
.traceToughnessTitleBoxToughnessRow {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: left;
    padding-left: 4px;
}
.eidolonRowNameSkillLevelSelection {
    background-color: rgba(0, 0, 0, 0.315);
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border-radius: 10px;
    padding-left: 5px;
    padding-right: 5px;
    margin-right: 5px;
}
.traitLevelDisplay {
    min-width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.toggleArrowBox {
    font-size: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.toggleArrowBox:hover {
    opacity: 0.5;
}
.traceToughnessValueBox {
    min-width: 40px;
    display: flex;
    justify-content: right;
    align-items: center;
    color: #dcc491;
    padding-right: 4px;
    text-align: right;
}
.traceToughnessValueBoxToughness {
    /* min-width: 40px; */
    /* display: flex;
    justify-content: right;
    align-items: center; */
    color: #dcc491;
    /* padding-right: 4px; */
    /* text-align: right; */
}
.traceContentBodyBox {
    width: 100%;
    height: 100%;
    max-height: 600px;
    overflow-y: scroll;
    padding-left: 4px;
}
.traceDisplayNameBox {
    font-size: 25px;
    width: 85%;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 2px;
    box-sizing: border-box;
}
.traceDisplayNameBoxAlt {
    font-size: 25px;
    width: 85%;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 4px;
    box-sizing: border-box;
    border-left: 2px solid #dbc291;
}
.traceAttackTargetType {
    width: 90%;
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 4px;
    text-align: left;
    color: #dd9337;;
    white-space: normal;
}



.eidolonsMainBoxHolder {
    width: 95%;
    height: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;
    /* flex-wrap: wrap; */
    overflow-y: scroll;
    box-sizing: border-box;
}
.skillsMainBoxHolder {
    width: 100%;
    /* height: 100%; */
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;
    /* flex-wrap: wrap; */
    /* overflow-y: scroll; */
    box-sizing: border-box;
}
.skillsMainBoxHolderEnemies {
    width: 100%;
    /* height: 100%; */
    display: flex;
    justify-content: space-evenly;
    align-items: flex-start;
    /* flex-direction: column; */
    /* flex-wrap: wrap; */
    /* overflow-y: scroll; */
    box-sizing: border-box;
}
.overviewSkillDataBox { 
    width: 100%;

    /* height: 50%;
    max-height: 50%;
    min-height: 50%; */
    display: flex;
    flex-direction: column;
    justify-content: column;
    align-items: left;
    /* margin: 2px; */
    /* max-width: 400px; */
    box-sizing: border-box;
    padding-left: 4px;
}
.eidolonRowBoxHolder { 
    width: 100%;

    /* height: 50%;
    max-height: 50%;
    min-height: 50%; */
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    align-items: flex-start;
    /* margin: 2px; */
    /* max-width: 400px; */
    box-sizing: border-box;
}
.eidolonRowBoxHolderEnemy { 
    width: 100%;

    /* height: 50%;
    max-height: 50%;
    min-height: 50%; */
    display: flex;
    /* flex-direction: column; */
    justify-content: left;
    align-items: center;
    margin-top: 2px;
    margin-bottom: 2px;
    /* margin: 2px; */
    /* max-width: 400px; */
    box-sizing: border-box;
}
.eidolonRowName {
    font-size: 25px;
    width: 100%;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 5px;
    box-sizing: border-box;
}
.eidolonRowNameSkill {
    font-size: 25px;
    width: 100%;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    /* padding-left: 5px; */
    box-sizing: border-box;
}
.eidolonRowNameTrigger {
    font-size: 20px;
    width: 100%;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-top: 2px;
    /* padding-left: 5px; */
    box-sizing: border-box;
}
.eidolonRowIconHolder {
    /* width: 100%; */
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2px;
    box-sizing: border-box;
}
.eidolonRowIconHolderEnemy {
    /* width: 100%; */
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 2px;
    margin-bottom: 2px;
    box-sizing: border-box;
}
.eidolonRowIcon {
    width: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    border: 2px solid #e1e1e4;
    border-radius: 50%;
    box-sizing: border-box;

    background: radial-gradient(
      circle at center,
      #473824 0%,
      #473824 10%,
      transparent 80%
    );
}
.eidolonRowIcon:hover {
    opacity: 0.5;
}
.eidolonRowIconEnemy {
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    /* border: 2px solid #e1e1e4; */
    /* border-radius: 50%; */
    box-sizing: border-box;

    background: radial-gradient(
      circle at center,
      #473824 0%,
      #473824 10%,
      transparent 80%
    );
}
.eidolonRowIconEnemyAlert {
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    /* border: 2px solid #e1e1e4; */
    /* border-radius: 50%; */
    box-sizing: border-box;
}
.rightDescriptionBoxEidolons {
    width: 100%;
    white-space: normal;
    text-align: left;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: left;
    padding-left: 5px;
    box-sizing: border-box;
    padding-right: 5px;
}
.rightDescriptionBoxEidolonsEnemy {
    width: 100%;
    white-space: normal;
    text-align: left;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: left;
    /* padding-left: 5px; */
    box-sizing: border-box;
    /* padding-right: 5px; */
    margin-left: 5px;
    margin-right: 5px;
}
.eidolonRankRowHolder {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* border: 1px solid red; */
    box-sizing: border-box;
    margin-bottom: 5px;
}
.eidolonRankRowName {
    font-size: 25px;
    width: auto;;
    white-space: normal;
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 2px;
    box-sizing: border-box;
    margin-right: 5px;
}
.eidolonRankHolderbox {
    width: 100%;
    max-width: 400px;
    /* background-color: #e1e1e4; */
    color: black;
    border-radius: 10px;
    margin-top: 5px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;
    /* border: 2px solid #e1e1e4; */
    overflow: hidden;

    /* filter: brightness(0.5); */
}
.eidolonBonusLevelRow {
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    white-space: normal;
    box-sizing: border-box;
}


.characterMainCenterImageTrace {
    /* border: 1px solid white;
    border: 1px solid white;
    outline: 1px solid white;
    outline-offset: 15px;
    border-radius: 50%; */
    /* width: 100%; */
    /* max-width: 90%; */
    /* width: 100%; */
    /* height: auto;
    object-fit: cover;
    box-sizing: border-box; */
    /* position: absolute; */
    /* top: 50%;
    left: 50%; */
    /* transform: translateY(-50%) translateX(50%) (0.7) ; */
    opacity: 0.15;
    width: 100%;
    height: 100%;

    /* right: 10px; */
    /* top: 50%;
    transform: translateY(50%); */
    /* font-size: 40px; */
    
}


.centerDisplayHolderBoxTraceSummary {
    /* width: 100%; */
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;

    position: absolute;
    left: 2%;
    bottom: 2%;

}
.traceSummaryEntryBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.traceSummaryEntryImage {
    width: 40px;
    height: 40px;
}

.hoveredTraceIcon:hover {
    filter: brightness(5);
    outline: 5px solid #1b86ff;
    outline-offset: 5px;
    border-radius: 50%;
}
.characterMinorTraceCircle {
    width: 35px;
    height: 35px;
    position: absolute;
    background-color: #e1e1e4;
    border-radius: 50%;
}
.characterSkillTraceCircle {
    background-color: #1e2137;
    border-radius: 50%;
    box-sizing: border-box;
    border: 2px solid #928d85;
}







.characterDisplayStatsBasic {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.imageRowStatisticImageBox,.imageRowStatisticImageBoxEnemyAdjustment {
    width: 10%;
    max-width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.imageRowStatisticImageBoxEnemyAdjustment {
    padding: 5px;
}
.imageRowStatisticImage,.imageRowStatisticImageMain,.imageRowStatisticImageStatMenu,.imageRowStatisticImagePhased {
    width: 100%;
    min-width: 20px;



    height: auto;
    object-fit: contain;
    scale: 1.2;
}
.imageRowStatisticImagePhased {
    width: 140%;
}
.imageRowStatisticImageStatMenu {
    width: 20px;
    height: 20px;
}
.imageRowStatisticImageMain {
    filter: invert(72%) sepia(63%) saturate(528%) hue-rotate(356deg) brightness(200%) contrast(91%) drop-shadow(1px 1px 4px rgba(0,0,0,1));
    /* filter: drop-shadow(2px 2px 4px rgba(0,0,0,0.6)); */
}
.imageRowStatisticNameBox,.imageRowStatisticNameBoxMain,.imageRowStatisticNameBoxFilterRow,.imageRowStatisticNameBoxDMGDetails {
    width: 60%;
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 2px;
    font-size: 16px;
}

.enemyMainBoxOverview {
    width: 100%;
    min-width: 300px;
    max-width: 300px;
    /* margin: 5px;
    padding: 5px; */
    box-sizing: border-box;
    display: flex;
    justify-content: space-evenly;
    align-items: center;

}
.enemyMainBoxOverviewColumn {
    width: 100%;
    margin: 5px;
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    box-sizing: border-box;
}


.bigFuckerBoxRow {
    margin-top: 5px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border-top: 2px solid #ffffff21;
}
.bigFuckerBox {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    box-sizing: border-box;
    width: 50%;
    min-width: 200px;
    padding-left: 2px;
    padding-right: 2px;
}
.bigFuckerBox + .bigFuckerBox {
    border-left: 2px solid #ffffff21;
}
.imageRowStatisticBox3PhaseData {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 25px;
    /* padding-left: 10px; */
    box-sizing: border-box;
    padding-left: 5px;
    
    justify-content: space-between;
    padding: 0px;
    width: 100%;
    padding-left: 2px;
    max-width: none;
    text-align: center;
}
.imageRowStatisticBox3PhaseDataEnemy {
    width: 100%;
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
    height: 25px;
    /* padding-left: 10px; */
    box-sizing: border-box;
    /* padding-left: 5px; */
    
    justify-content: space-between;
    padding: 5px;
    margin: 5px;
    width: 100%;
    /* padding-left: 2px; */
    max-width: 100%;
    text-align: center;
    font-size: 20px;
}







.characterDisplayNameBox {
    font-size: 25px;
    width: 100%;
    /* white-space: normal; */
    display: flex;
    justify-content: left;
    align-items: center;
    text-align: left;
    padding-left: 2px;
    box-sizing: border-box;
}





.characterMainCenterDisplayOverviewHolderBox {
    width: 100%;
    height: 100%;
    /* border: 1px solid blue; */
    box-sizing: border-box;
    /* overflow: hidden; */
    display: flex;
    justify-content: center;
    align-items: flex-start;

    overflow-y: auto;
}

.characterDisplayElementWeaknessIconHolderBoxBattleSettings {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: auto;
    /* width: 100%; */
    width: auto;
    border-radius: 10px;
    backdrop-filter: blur(5px);
    background-color: rgba(0, 0, 0, 0.219);
    /* width: 120px;
    max-width: 120px; */
    /* position:absolute;
    right: 0;
    bottom: 50%; */
    /* transform: translateY(50%); */
    /* border: 1px solid green; */
}

.characterDisplayElementWeaknessIconHolderEnemies {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: auto;
    /* width: 100%; */
    width: auto;
    border-radius: 10px;
    margin: 5px;
    margin-left: 0px;
    margin-right: 0px;
    padding: 5px;
    /* backdrop-filter: blur(5px); */
    /* background-color: rgba(0, 0, 0, 0.219); */
    /* width: 120px;
    max-width: 120px; */
    /* position:absolute;
    right: 0;
    bottom: 50%; */
    /* transform: translateY(50%); */
    /* border: 1px solid green; */
}
.characterDisplayElementWeaknessIcon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    padding: 2px;
    backdrop-filter: none;
    /* backdrop-filter: blur(5px); */
    background-color: transparent;
}
.enemyResBoxHolder {
    /* width: 100%; */
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-sizing: border-box;
}
.enemyResBoxHolderRow {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    box-sizing: border-box;
    flex-direction: row;
    margin: 5px;
}







@media (max-width: 768px) {

    .bigFuckerBoxRow {
        flex-direction: column;
        /* width: 100%; */
        /* justify-content: center;
        align-items: flex-start; */
    }
    .bigFuckerBoxRowMobileAnom {
        flex-direction: row;
    }
    .bigFuckerBox {
        width: 100%;
        /* min-width: 45%; */
    }

    .enemyWaveSummaryHolderEnemy {
        align-items: center;
        justify-content: center;
        min-width: unset;
        width: 100%;
        box-sizing: border-box;
    }
    
    /* .rotationsSectionRowHolder2Overview,.rotationsSectionRowHolder1Overview {
        max-width: 100%;
    } */
    /* .characterMainCenterDisplayEnemies {
        width: 100%;
    } */
    .enemyWaveEnemyDisplayBoxWideEnemy,.enemyMainBoxOverview,.enemyMainStatsBox {
        width: 100%;
        max-width: unset;
    }
    .enemyWaveEnemyDisplayBoxWideEnemy {
        max-width: 90%;
    }
    .enemyMainBoxOverviewColumn,.characterMainCenterDisplayOverviewHolderBox {
        height: auto;
        max-height: unset;
        max-width: 100%;
    }
    .enemyMainBoxOverviewColumn {
        margin: 0px;

    }
    .characterMainCenterDisplayOverviewHolderBox {
        justify-content: flex-start;
        align-items: center;
    }
    .skillsMainBoxHolderEnemies {
        flex-direction: column;
        height: auto;
        max-height: unset;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        margin: 5px;

        /* justify-content: center;
        align-items: flex-start; */

    }
    .enemyMainStatsBoxScalarOverview {
        width: 100%;
        flex-direction: column;
    }
    .enemyWaveEnemyDisplayBox {
        width: 49%;
    }

    .characterMainCenterDisplay {
        height: auto;
    }
    .expandedDataHolderHolderBox {
        flex-direction: column;
        height: auto;
        min-height: unset;
    }
    .expandedMiddle,.expandedQuarters,.expandedMiddleNoQuarters {
        width: 100%;
        height: auto;
    }

    .actionDetailHeaderRowCharacterImage {
        /* height: 100%; */
        z-index: 0;
    }
    .actionDetailHeaderRowCharacterImageAndEnergyBox {
        /* overflow-y: hidden;
        overflow-x: hidden; */
        width: 100%;
        padding-left: 0px;
        /* width: max-content; */
    }
    .libraryCharacterDataHeader {
        flex-direction: column;
    }
    .libraryCharacterDataHeaderCharNameBox {
        padding-left: 0px;
        padding-right: 0px;
        margin: 0px;

    }

    .libraryCharacterDataHeaderCharName {
        padding: 0px;
        margin: 0px;
        width: 100%;
        max-width: 100%;
    }
    .libraryCharacterDataHeaderCharNameInner {
        white-space: normal;
        z-index: 1;
        backdrop-filter: blur(5px);
        background-color: rgba(0, 0, 0, 0.137);
    }

    .mainBodyRowOrColumnRow {
        flex-direction: column;
    }
    .eventReaderControlsBox,.eventCharacterFileHeader,.eventCharacterFileInfoBox,.eventReaderControlsBoxTrimRow {
        width: 100%;
        max-width: 100%;
    }
    .eventBodyMainBox {
        flex-direction: column;
    }
    .eventCharacterFileHeader {
        width: 100%;
        max-width: 100%;
    }
    .eventBodyScrollerMain {
        max-width: 100%;
        overflow: auto;
        max-height: none;
        width: 100%;
        flex-direction: column;
    }
    .actionDetailBody2 {
        width: fit-content;
        max-width: none;
        white-space: nowrap;
    }
    .rotationsSectionRowHolder2,.rotationsSectionRowHolder1,.rotationsConditionsBodyBox,.rotationConditionOperatorBoxMain,.rotationsPermaConditionsExpand {
        width: fit-content;
        max-width: none;
        /* align-items: center;
        justify-content: flex-start; */
        align-items: flex-start;
        justify-content: center;
    }
    /* .rotationsConditionsBodyBox,.actionDetailBody2,.rotationsSectionRowHolder1,.rotationsSectionRowHolder2,.rotationsPermaConditionsExpand {
        width: auto;
        max-width: none;
    } */
    
}