/* TODO: cleanup
  TODO: think about >* side by side margin vs hardcoded in the code
 */

.page-container {
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  padding-left: 10px;
  display: inline-flex !important;
}

@media only screen and (max-width : 992px) {
  .page-container {
    padding-left: 0;
    display: flex !important;
  }
}

.center-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.side-by-side {
  display: flex;
  justify-content: center;
  align-items: center;
}

.column {
  margin-left: auto;
  margin-right: auto;
  display: grid;
  justify-content: center;
  align-items: center;
}
.side-by-side >* {
  margin: 5px 5px;
}

.bold {
  font-weight: bold;
}

.no-margin {
  margin: 0px;
}

.margin-sm {
  margin: 5px;
}

.margin {
  margin: 20px;
}

.button-sm {
  padding: 0 10px !important;
}

.pad-sides-sm {
  padding: 0 8px !important;
}

#github-link {
  display: flex !important;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid;
  margin-bottom: 10px;
}

.overlay {
  position: absolute;
  object-position: left top;
  top: 0;
  left: 0;
}

.imageWithCanvasWrapper {
  width:100%;
  height:100%;
  position:relative;
}

input[type="file"]::-webkit-file-upload-button {
    background: #26a69a;
    border: 1px solid gray;
    cursor: pointer;
    color: #fff;
    border-radius: .2em;
}

.defaultlist li {
    display: list-item; 
    list-style-type:disc;
}

.video {
  width: 448px;
  height: 448px;
  object-fit: none;
/*  object-position: 50% 50%;*/
}

.video-pool-output {
  width: 220px;
  height: 220px;
  object-fit: cover;
/*  object-position: 50% 50%;*/
}

.bbox {
  filter: grayscale(100%);
/*  object-position: left top;
*/}

.picker-container {
  width: 100%;
}

.picker {
  position: relative !important;
}

.image_picker_image {
  width: 70px;
  height: 70px;
}

.img-container img {
  max-width: 100%;
  max-height: 100%;
}

.modal {
  max-width: 50% !important;
  max-height: 85% !important;
}

h6 {
  font-size: 0.95rem !important;
  line-height: 110% !important;
  margin: 0.5rem 0 0.4rem 0 !important;
}

/*
ul.dropdown-content.select-dropdown li span {
  font-size: x-large;
}
*/

.title-and-dropdown input.select-dropdown, .title-and-dropdown input {
  font-size: x-large !important;
}

.yellow-bg {
  background-color: #fefce8;
}

.green-bg {
  background-color: #e8feeb;
}