body {
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 0.9em;
}
h1 {
  margin: 5px;
  font-variant: small-caps;
  font-style: italic;
}
.block, .job {
  margin: 5px;
  padding: 5px;
}

form {
  border: 1px solid lightgrey;
}

input[type=text] {
  padding-left: 3px;
  padding-right: 3px;
}

fieldset {
  border: #E8E8E8 1px solid;
}
fieldset div {
  margin: 5px;
  margin-right: 10px;
}
#optim-options fieldset > div {
  display: inline-block;
}

form #optim-options input {
  width: 8em;
}

#doc-link {
  float: right;
  margin: 5px;
  padding: 5px;
}

#documentation li {
  margin: 5px;
}
#documentation .file-table-help {
  border-collapse: collapse;
}
#documentation .file-table-help td {
  border: 1px solid lightgrey;
  padding: 3px;
}
#documentation .required {
  font-weight: bold;
}

#result-graph {
  float: right;
  width: 300px;
  height: 200px;
  margin-left: 10px;
  margin-top: 10px;
}

#result {
  width: calc(100% - 330px);
  height: 600px;
  margin-top: 5px;
  min-width: 300px;
}

#jobs-list{
  height: 155px;
  width: 100%;
  box-sizing: border-box;
  overflow-y: scroll;
  display: inline-block;
}
.job_title {
  font-family: Courier New, Courier, Lucida Sans Typewriter, Lucida Typewriter, monospace;
}

.error {
  font-weight: bold;
  color: red;
}

.job {
  line-height: 10px;
  margin-top: 10px;
}

.optim-start {
  margin: 8px 0px;
}

#map-container {
  height: 100vh;
}

#sidebar {
  height: 94vh;
  width: 300px;
  background-color: white;
  position: absolute;
  z-index: 999;
  right: 2vh;
  top: 2vh;
  border: 1px solid #878787;
  border-radius: 5px;
}

#map {
  height: inherit;
}

.circle {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  border: 1px solid white;
  display: inline-block;
}

.leaflet-div-icon {
  background-color: initial;
  border: 0;
}

#sidebar h1 {
  text-align: center;
}

.form {
  text-align: center;
}

.form * {
  padding: 5px;
}

.form input {
  width: 90%;
  text-align: center;
}

.loading {
  cursor: progress;
}

body[data-page=result] {
  margin: 0;
}

#select-container {
  padding-left: 10px;
  margin-top: 10px;
}

.dot {
  height: 13px;
  width: 13px;
  border-radius: 50%;
  display: inline-block;
}

.color-selector {
  display: inline-block;
  width: 20%;
  padding-left: 5px;
}

.color-selector > div {
  text-align: center;
}

#color-select-container {
  margin-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
}

#color-select-container > .color-selector:first-child, #color-select-container > br + .color-selector {
  padding-left: 0;
}

#select-container .select2-container {
  max-height: 200px;
  overflow-y: auto;
}