@font-face {

font-family: 'Roboto';

font-style: normal;

font-weight: 100;

src: local('Roboto Thin'), local('Roboto-Thin'), url(https://fonts.gstatic.com/s/roboto/v18/KFOkCnqEu92Fr1MmgVxIIzIXKMny.woff2) format('woff2');

unicode-range: U+0000-00FF;

}

* {

margin: 0;

padding: 0;

box-sizing: border-box;

}

#map { height: 100%; }

body {

font-family: 'Roboto', sans-serif;

font-weight: 100;

background-color: #173340;

color: #333;

font-size: 16px;

}

h3 {

font-size: 22px;

font-weight: 400;

text-align: center;

margin-top: 10px;

}

ul {

margin-top: 10px;

list-style-type: none;

}

.share_icon {

display: inline-block;

height: 15px;

width: 17px;

background: url('../img/share.svg') no-repeat center;

margin-left: 8px;

margin-bottom: 2px;

cursor: pointer;

}

a { color: inherit; }

a:hover { text-decoration: none; }

#toggles {

position: fixed;

top: 10px;

right: 13px;

height: 40px;

}

#toggles div {

height: 25px;

width: 25px;

display: inline-block;

background-color: white;

margin-left: 10px;

margin-bottom: 10px;

text-align: center;

padding-top: 3px;

cursor: pointer;

}

#fullscreen-controls {

background: white url('../img/fullscreen.svg') no-repeat center;

background-size: 60%;

}

.fullscreen #fullscreen-controls {

background: white url('../img/exit-fullscreen.svg') no-repeat center;

background-size: 70%;

}

#search-menu-button {

background: white url('../img/search.svg') no-repeat center;

background-size: 60%;

}

#about {

position: fixed;

top: 44px;

right: 0;

width: 500px;

max-width: 100vw;

background: white;

text-align: center;

display: none;

}

#about #toggle-logos > div {

display: inline-block;

margin-top: 15px;

margin-left: auto;

margin-right: auto;

padding: 6px;

color: #BBB;

font-weight: 400;

border: 1px solid #BBB;

border-radius: 10px;

cursor: pointer;

}

#search {

position: fixed;

top: 44px;

right: 0;

width: 500px;

max-width: 100vw;

background: white;

text-align: center;

display: none;

}

#toggle-logos.off #logos-on, #toggle-logos.on #logos-off {

display:none;

}

#toggle-logos .main {

font-size: 0.9em;

}

#toggle-logos .sub {

font-size: 0.75em;

}

#about #development {

margin: 20px 0;

}

#search #filter {

margin: 20px 0;

}

.stripe {

background: #175f7e;

color: white;

font-weight: bold;

padding: 6px;

margin-top: 0;

}

tr td:first-child {

text-align: right;

font-weight: bold;

width: 30%;

padding-right: 5px;

}

tr td:last-child {

text-align: left;

}

#about img {

width: 15px;

margin-left: 5px;

}

#tools td:first-child {

width: 40%;

}

canvas {

image-rendering: optimizeSpeed;

image-rendering: -moz-crisp-edges;

image-rendering: optimize-contrast;

image-rendering: crisp-edges;

image-rendering: pixelated;

}

input {

width: 75%;

font-size: 1.1rem;

font-weight: normal;

color: darkslategray;

border: 1px solid #ced4da;

}

.searchable-select .hidden {

display: none;

}

.searchable-select ul {

width: 75%;

display: inline-block;

list-style-type: none;

border: 1px solid lightgray;

border-top: none;

max-height: 30vh;

min-height: 5vh;

margin: 0;

padding: 0;

overflow-y: auto;

}

.searchable-select ul li {

cursor: pointer;

font-weight: normal;

border: 1px solid lightgray;

border-top: none;

border-left: none;

color: darkslategray;

}

.searchable-select ul li.selected {

background-color: blue;

border: 1px solid lightgray;

color: white;

}

.searchable-select ul li:hover:not(.selected) {

background-color: lightgray;

}