html, body{ height: 100%; width: 100%; } body { padding: 0; margin: 0; } html, p{ font-family: Calibri, Roboto, Arial,"Ubuntu Mono"; font-size: 1rem; } p{ font-size: 1.25rem; } #map { height: 70%; width: 100%; margin: 0; } .padded{ padding: 1rem; } #heading{ background: #000; color: #ddd; min-height: 5%; height:4rem; width: 100%; padding-left: 1em; } .icon{ width: 2rem !important; height: 2rem !important; display: inline-block; margin-right: 1rem; background: white; border-radius: 100%; padding: 0.25rem; margin-top: -0.5rem; float: left; } .title{ margin-right: 1em; line-height: 1.5rem; } h2{ font-weight: normal; } #overpass-api-controls { position: fixed; top:0; right: 1em; padding: 10px; background-color: rgb(255, 255, 255); z-index: 10; } #overpass-api-controls a { display: inline; } img.leaflet-marker-icon{ background: #fff; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; padding: 0.5rem; border: solid 1px #ccc; margin-left: -20px; margin-top: -20px; } img.leaflet-marker-icon.diet--vegetarian_yes{ border: solid 3px green; } #query-button, .edit-button{ background: #497cd3; padding: 0.5em; border-radius: 0.25em; color: white; border: solid 1px #497CD3FF; } #query-button{ min-width: 10em; } .pull-left{ float:left; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } a{ color: #3388ff; } #spinning_icon{ position: fixed; top: 0.5rem; right: 0.5rem; } #spinning_icon svg{ position: fixed; top: 0.5rem; right: 0.5rem; } #spinning_icon svg{ animation: spin 2s linear infinite; } #footer{ max-width: 70ch; margin: 0 auto; }