#container1 {
    display: flex;
}
#mapcontainerbak {
    border: 2px solid black;
    display: block;
    margin-left: 100;
    margin-right: 825;
}
img {
    padding: 2px;
    border: 2px solid red;
}
#mainMen {
    flex: 1;
    max-height : 300px;
    border: 2px solid black;
    background-color: khaki
}
#outtext {
    flex: 1;
    max-height : 300px;
    border: 2px solid  black;
    overflow-y: scroll;
    background-color: cyan
}

#logger {
    flex: 1;
    max-height : 300px;
    border: 2px solid black;
    background-color: khaki;
    overflow-y: scroll;
}
#backup_obs_alert {
    padding: 20px;
    max-height: 100px;
    max-width: 1000px;
    border: 2px solid blueviolet;
    font: 400 12px arial;
}

table.dataframe {
   border: 3px solid blue;
   border-collapse: collapse;
   text-align: left;
}
.dataframe thead {
   background: lightblue;
   text-align: left;
}
.dataframe tr:nth-child(even) {
  background: #8492b3;
}

.dataframe tr {
 text-align: left!important;
}


#mapcontainer {
 }   

.log-boolean,
.log-undefined {color: purple;}
.log-object,
.log-string {color : black ;}
.log-number {color: red ;}

#obs_alert:hover #hoverShow1 {
    display: block;
}
   
 #obs_alert #hoverShow1 {
    display: none;
    position: absolute;
    background-color: whitesmoke;
    border: 2px solid black;
    width: 400px;
    height: 200px;
    left: 200px;
    top: 100px;
   }

a:link, a:visited {
    height: 25;
    width:200;
    background-color: blue;
    color: white;
    padding: 14px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border: 2px solid black
  }
  
  a:hover, a:active {
    background-color: red;