#map{height:100%}html,body{height:100%;margin:0;padding:0;font-family:Roboto,Arial,sans-serif}#controls{position:fixed;top:0;left:0}.control{background-color:#fff;border:1px solid #0000;border-radius:2px;outline:none;width:480px;margin-top:8px;margin-left:10px;padding:8px 10px;font-family:Roboto;font-size:15px;font-weight:300;line-height:18px;box-shadow:0 2px 6px #0000004d}input.control{text-overflow:ellipsis;width:465px;padding-right:25px}input.control:focus{border-color:#4d90fe}#clear-button{cursor:pointer;border:1px solid #0000;padding:8px 10px;font-size:24px;font-weight:300;line-height:18px;position:absolute;bottom:2px;right:0}.control p{margin-top:0;margin-bottom:8px}.control p:last-child{margin-bottom:0}.icon{vertical-align:-2px;height:15px}.destination{margin-right:4px;display:inline-block}.destination .icon{vertical-align:-4px;height:24px}.line{border-radius:2px;padding:1px 5px;display:inline-block}.steps{table-layout:fixed;border-spacing:0;width:100%}.steps td{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.steps td:first-child{width:4em}.steps td:last-child{text-align:right;width:3em}.total-walking td{border-top:1px solid #000}.total td{border-top:2px solid #000;font-weight:400}.marker{z-index:500;border:2px solid #000;border-radius:50%;width:48px;height:48px;position:relative;top:-25px;left:-25px}@media screen and (device-width<=480px){#controls{right:0}.control{max-width:92%;margin-left:2%;padding-left:2%;padding-right:2%}input.control{max-width:84%;padding-right:10%}#clear-button{padding-right:2%;right:2%}.step{display:none}.steps td:first-child{width:auto}.total-walking td{border-top:none}}