styles.css

*{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;box-sizing:border-box;margin:0;transition:background-color 0.5s}#main{display:flex;flex-direction:column;height:100vh;padding:20px}#main h1{margin-bottom:20px;cursor:pointer;transition:color 0.2s}#main h1:hover{color:#acacac}#main #result{margin-top:20px}#main #result p{height:20px;margin:10px 10px}#main #result img{height:50px;margin:-20px 0;filter:drop-shadow(0px 0px 3px gray)}#main #result .pre-city{font-weight:bold;color:#cfcfcf;cursor:pointer;max-width:max-content;transition:color 0.3s}#main #result .pre-city:hover{color:#FFF}#main #result .map-link{background-color:#866ad3;border-radius:5px;margin-top:20px;cursor:pointer}#main #result .map-link a{padding:20px;display:flex;flex:1;color:#f5fff7;font-weight:bold;text-decoration:none}#main #result .map-link:hover{background-color:#4929a1}#main .mylocation-button{cursor:pointer;margin-top:20px;background-color:#bd93f9;padding:20px;text-align:center;font-weight:bold;border-radius:5px}#main .mylocation-button:hover{background-color:#9061d3}#main .footer{font-weight:bold;color:#8f9099;text-decoration:none;transition:color 0.3s}#main .footer:hover{color:#696a72}.dark{background-color:#44475a;color:#f8f8f2}.light{color:#44475a;background-color:#f8f8f2}