.bigmath > mjx-container[jax="CHTML"][display="true"] mjx-math {
    font-size: 170% !important;
}
.mediummath > mjx-container[jax="CHTML"][display="true"] mjx-math {
    font-size: 120% !important;
}
.present > p,
li {
    text-align: left !important;
}

.mjx-n > img,
svg {
    vertical-align: middle !important;
}

.canvrow {
    display: flex;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    justify-content: center;
}

.canvcolumn {
    flex: 50%;
    padding: 3%;
}

.dark .card {
    background: #44475a;
}
.exp-company > a {
    color: #bd93f9 !important;
}
.experience .m-2 .border,
.experience .col.border-right {
    /* background-color: #bd93f9 !important; */
    border-color: #bd93f9 !important;
}
.experience .m-2 .border.exp-fill {
    background-color: #bd93f9 !important;
}

#unity-container {
    position: absolute;
}
#unity-container.unity-desktop {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
#unity-container.unity-mobile {
    position: fixed;
    width: 100%;
    height: 100%;
}
#unity-canvas {
    background: #231f20;
}
.unity-mobile #unity-canvas {
    width: 100%;
    height: 100%;
}
#unity-loading-bar {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: none;
}
#unity-logo {
    width: 154px;
    height: 130px;
    background: url("/games/contact_with_unknot/TemplateData/unity-logo-dark.png")
        no-repeat center;
}
#unity-progress-bar-empty {
    width: 141px;
    height: 18px;
    margin-top: 10px;
    margin-left: 6.5px;
    background: url("progress-bar-empty-dark.png") no-repeat center;
}
#unity-progress-bar-full {
    width: 0%;
    height: 18px;
    margin-top: 10px;
    background: url("progress-bar-full-dark.png") no-repeat center;
}
#unity-footer {
    position: relative;
}
.unity-mobile #unity-footer {
    display: none;
}
#unity-webgl-logo {
    float: left;
    width: 204px;
    height: 38px;
    background: url("webgl-logo.png") no-repeat center;
}
#unity-build-title {
    float: right;
    margin-right: 10px;
    line-height: 38px;
    font-family: arial;
    font-size: 18px;
}
#unity-fullscreen-button {
    float: right;
    width: 38px;
    height: 38px;
    background: url("fullscreen-button.png") no-repeat center;
}
#unity-warning {
    position: absolute;
    left: 50%;
    top: 5%;
    transform: translate(-50%);
    background: white;
    padding: 10px;
    display: none;
}

.sliderow {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
    justify-content: space-evenly;
    max-height: calc(var(--slide-height));
    max-width: calc(var(--slide-width));
}

.slidecolumn {
    padding: 0;
    max-height: calc(var(--slide-height));
    max-width: calc(var(--slide-width));
    flex-basis: 0;
    flex-grow: 1;
}

.centerImg * {
    max-height: calc(var(--slide-height));
    max-width: calc(var(--slide-width));
    width: auto;
}

.centerImg {
    max-height: calc(var(--slide-height));
    max-width: calc(var(--slide-width));
    width: auto;
}

.mermaid-done {
    max-height: calc(var(--slide-height)) !important;
    max-width: calc(var(--slide-width)) !important;
    width: auto;
}

.mermaid-done svg {
    max-height: calc(var(--slide-height)) !important;
    max-width: calc(var(--slide-width)) !important;
    width: auto;
}

.mermaid * {
    line-height: 0.9;
}

.stroke-blue {
    stroke: var(--r-Blue) !important ;
}
.stroke-green {
    stroke: var(--r-Green) !important ;
}
.stroke-orange {
    stroke: var(--r-Orange) !important ;
}
.stroke-pink {
    stroke: var(--r-Pink) !important ;
}
.stroke-purple {
    stroke: var(--r-Purple) !important ;
}
.stroke-red {
    stroke: var(--r-Red) !important ;
}
.stroke-yellow {
    stroke: var(--r-Yellow) !important ;
}
.stroke-background {
    stroke: var(--r-Background) !important ;
}
.stroke-foreground {
    stroke: var(--r-Foreground) !important ;
}
.stroke-highlight {
    stroke: var(--r-Highlight) !important ;
}
.stroke-selection {
    stroke: var(--r-Selection) !important ;
}
.fill-blue {
    fill: var(--r-Blue) !important ;
}
.fill-green {
    fill: var(--r-Green) !important ;
}
.fill-orange {
    fill: var(--r-Orange) !important ;
}
.fill-pink {
    fill: var(--r-Pink) !important ;
}
.fill-purple {
    fill: var(--r-Purple) !important ;
}
.fill-red {
    fill: var(--r-Red) !important ;
}
.fill-yellow {
    fill: var(--r-Yellow) !important ;
}
.fill-background {
    fill: var(--r-Background) !important ;
}
.fill-foreground {
    fill: var(--r-Foreground) !important ;
}
.fill-highlight {
    fill: var(--r-Highlight) !important ;
}
.fill-selection {
    fill: var(--r-Selection) !important ;
}

.svgContainer.halfHeight > svg {
    max-height: 50vh !important;
}
.svgContainer.fullHeight > svg {
    max-height: 100vh !important;
}
.svgContainer.eighthHeight > svg {
    max-height: 12.5vh !important;
}
.svgContainer.sixteenthHeight > svg {
    max-height: 6.25vh !important;
}
.svgContainer.quarterHeight > svg {
    max-height: 25vh !important;
}
.svgContainer.thirdHeight > svg {
    max-height: 33vh !important;
}
.svgContainer.twothirdHeight > svg {
    max-height: 66vh !important;
}
.svgContainer.threequarterHeight > svg {
    max-height: 75vh !important;
}

.svgContainer.halfHeight > p > svg {
    max-height: 50vh !important;
}
.svgContainer.fullHeight > p > svg {
    max-height: 100vh !important;
}
.svgContainer.eighthHeight > p > svg {
    max-height: 12.5vh !important;
}
.svgContainer.sixteenthHeight > p > svg {
    max-height: 6.25vh !important;
}
.svgContainer.quarterHeight > p > svg {
    max-height: 25vh !important;
}
.svgContainer.thirdHeight > p > svg {
    max-height: 33vh !important;
}
.svgContainer.twothirdHeight > p > svg {
    max-height: 66vh !important;
}
.svgContainer.threequarterHeight > p > svg {
    max-height: 75vh !important;
}