body{margin:0;font-family:Arial,sans-serif;width:100vw}.up-container{width:100vw;height:70vh;display:flex}.left-container{width:70%;height:100%;min-width:0;display:flex;justify-content:center;align-items:center}.right-container{display:flex;flex-direction:column;width:30%;height:100%}.bottom-container{padding:0 0 10px 20px;box-sizing:content-box}.input_pair{display:inline-flex;align-items:center;margin-right:15px}.border{border:2px solid #ccc}.pop_up_window{display:none;position:absolute;background:white;border:1px solid #ccc;padding:10px;z-index:20;top:50%;left:50%;transform:translate(-50%,-50%);width:30vw;max-height:80vh;overflow:auto;box-sizing:border-box}.close_button{position:absolute;top:5px;right:5px;background:none;border:none;font-size:18px;cursor:pointer;color:#666}.close_button:hover{color:#000}#loading{display:none;position:absolute;top:10px;left:10px;background:rgba(255,255,255,.8);padding:10px;border-radius:5px;text-align:center}#loading:after{content:"";display:block;width:20px;height:20px;margin:5px auto;border-radius:50%;border:3px solid #3498db;border-top-color:transparent;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.leaflet-control-attribution{display:block}@media (max-width:768px){.all-container{flex-direction:column}.left-container{height:50vh;width:100vw;border-right:none;border-bottom:1px solid #ccc}}