.global_container {
    /* background-color: red; */
    display: grid;
    grid-template-rows: auto auto auto;
    grid-template-columns: 3fr 2fr; 
    /* max-width: 1600px; */
    /* max-height: 90; */
    max-width: 83vw;
    gap: 10px;
    /* grid-template-areas: "header header"
                        "main_map main_widget"
                        "footer footer"; */
}


header {
    /* background-color: aqua; */
    grid-column: 1 /3 ;
    grid-row: 1/2;
    display: flex;
    justify-content: center;
    /* align-items: center; */
}

/* main {
    background-color: azure;
    grid-row: 2;
    grid-column: 1/ 3; 
} */



.main_left {
    /* width: 60vw; */
    /* background-color: blueviolet; */
    /* aspect-ratio: 1 / 1 ;  */
    width: 100%;
    display: flex;
    grid-row: 2;
    grid-column: 1;
    justify-content: center;
    /* align-items: center; */
}

.main_widget {
    grid-row: 2;
    grid-column: 2/3;
    /* background-color: yellow; */
}

footer {
    /* background-color: bisque; */
    grid-row: 3/4;
    grid-column: 1/ 3;
    display: flex;
    justify-content: center;
}


#main_map {
    width: 80vh;
    height: 80vh;
    border: 2px solid black;
    /* background-color: rgb(36, 170, 59); */
    
}

.slider {
    width: 45%;
}

h2 {
    text-align: center;
}

#data_window {
    display: flex;
    text-align: center;
}

#ob_window_contrainer {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; 
    padding: 20px;
    gap: 20px;
}

.image {
    width: 100%;
    aspect-ratio: 1/1;
    border: 2px solid black;
}
.ob_svg {
    height: 12vh;
    aspect-ratio: 1/1;
    border: 2px solid black;

}
.selected {
    border: 3px solid red;

}








#tooltip {
    position: absolute;
    width: 200px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
}

#tooltip.hidden {
    display: none;
}

#tooltip p {
    margin: 0;
    font-family: sans-serif;
    font-size: 16px;
    line-height: 20px;
}