*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* html,body{
    height:100%;
    margin:0;
} */

#navbar{
    height:80px;
    background-color:#03192c;
    display:flex;
}

#logo{
    height:60px;
    width:60px;
    background-color:white;
    color:black;
    font-weight:bold;
    margin-left:150px;
    margin-top:10px;
}

#search{
    height:100%;
    width:70%;
    display:flex;
    margin-left:60px;
}

#search_city{
    width:70%;
    height:50%;
    margin-left:50px;
    margin-top:20px;
    text-align:center;
    border:none;
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
    background-color:#3a4b5f;
    color:white;
    font-size:1rem;
}
#search_city:active{
    border:none;
}

#search_icon{
    height:50%;
    width:3.5%;
    background-color:white;
    margin-top:20px;
    text-align:center;
    padding-top:10px;
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
    color:white;
    background-color:#3a4b5f;

}

#navbar2{
    height:30px;
     background-color:#3a4b5f;

}

#map{
    min-height:700px;
    background-image:url("background-map.jpg");
    background-size:cover;
    background-repeat:no-repeat;
    position:relative;
    
}



#info_shown{
    height:70%;
    width:40%;
    
    background-color:white;
    position:absolute;
    top:70px;
    left:30.5%;
    border:4px solid #3a4b5f;
    display:none;
    
    justify-content:center;
    align-items:center;
    
}

#info2{
    height:50%;
    width:50%;
    background-color:grey;
    
    
    display:none;

    justify-content:center;
    align-items:center;
    font-size:1.25rem;
    line-height:2;


}