body {
    background-color: rgb(22, 22, 22);
    overflow: hidden;
    height: 100dvh;
}
.main-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/* object-fit: contain; */
z-index: 0;
}
.second-img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /* object-fit: contain; */
   z-index: 1;
}
.hidden-img {
   opacity: 0;
}
.main-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    color: black;
    font-size: 2em;
    padding: 0;
    margin: 0;
}
svg {
    object-fit: contain;
    width: 100%;
    height: 100%;
}
.svg-rect {
    pointer-events: all;
}
.svg-rect:hover {
    cursor: pointer;
}

.material-symbols-sharp {
    font-size: 2em !important;
    color: blue;
    pointer-events: none;
    user-select: none;
}

.icon-visibile {
    fill: #1B2B56;
    stroke: #F0A123;
    stroke-width: 2;
}
.unit-label {
    pointer-events: none;
}
.unit-more-rect {
    cursor: pointer;
}

.unit-more {
    pointer-events: none;
}
.info-container {
    position: fixed;
    top: 0;
    right: 0;
    width: 18%;
    background-color: white;
    height: fit-content;
    padding: 1em;
    transform: translate(100%);
    transition: 400ms;
    overflow-y: scroll;
    box-sizing: border-box;

}
.info-container2 {
	position: fixed;
	top: 0;
	left: 0;
	width: 18%;
	background-color: white;
	height: fit-content;
	padding: 1em;
	transform: translate(-100%);
	transition: 400ms;
	overflow-y: scroll;
    box-sizing: border-box;

}
.info-close, .info-close2 {
    user-select: none;
    cursor: pointer;
}
.header-grid {
	display: grid;
	grid-template-columns: 90% 10%;

}
.info-header {
    font-size: 0.8em;
    font-family: "Lato", sans-serif;
    font-weight: 900;
    font-style: normal;
    border-bottom: 0.1em #C38A4D solid;
}
.info-text, .info-text2, .info-more, .info-more2{
    font-size: 0.6em;
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
}
.info-more, .info-more2 {
	cursor: pointer;
	user-select: none;
	color: rgb(27,43,86);
}
.info-more:hover, .info-more2:hover {
	color: rgb(195,138,77);
}
.svg-link:hover {
	cursor: pointer;
	z-index: 99;
}
.helpful-prompt{ 
    position: fixed;
    padding: 1em;
    font-size: 1.2em;
    z-index: 100;
    bottom: 0;
    right: 50%;
    transform: translate(50%);
    background-color: white;
}