/*
  uv must attach to the borders of the page
*/
body {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
/*
  all width in percent is relative to this
*/
html, body {
  width: 100%;
  height: 100%;
}

#uv {
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
  border: none;
}

/*
  put our logo in the upper left corner
*/
.uv .headerPanel .options {
  background-image: url(logo_i.png);
  background-repeat: no-repeat;
  background-position: 5px 5px;
  background-size: 40px auto;
}

/*
  hide iiif button in share overlay
*/
.uv .overlay.share .middle .content .footer {
  display: none !important;
}

/*
  separate iiif button
*/
.uv-icon-shared-data-button {
  background-image: url(iiif.png);
  background-repeat: no-repeat;
  display: inline-block;
  height: 30px;
  vertical-align: middle;
  width: 30px;
  cursor: pointer;
}

.uv.en-gb .overlays > div.multiSelect {
  width: 800px;
  max-width: 90%;
}

.uv.en-gb .overlays > div.multiSelect .content {
  height: 500px;
}

.uv.en-gb .overlay.share {
  width: 400px;
  max-width: 90%;
}

.uv.en-gb .overlay.share .middle .content .tabsContent .view {
  height: 100px !important;
}

@media only screen and (min-width: 0px) and (max-width: 500px) {
  .uv.en-gb .overlays > div.multiSelect .content .iiif-gallery-component .header {
    height: auto;
    margin-bottom: 10px;
  }
  .uv.en-gb .overlays > div.multiSelect .content .iiif-gallery-component .header .left {
    float: none;
    display: block;
    margin-bottom: 10px;
  }
  .uv.en-gb .overlays > div.multiSelect .content .iiif-gallery-component .header .right {
    float: none;
    display: block;
    margin-bottom: 10px;
  }
}
@media only screen and (min-height: 300px) and (max-height: 349px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 250px;
  }
}
@media only screen and (min-height: 350px) and (max-height: 399px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 300px;
  }
}
@media only screen and (min-height: 400px) and (max-height: 449px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 350px;
  }
}
@media only screen and (min-height: 450px) and (max-height: 499px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 400px;
  }
}
@media only screen and (min-height: 500px) and (max-height: 549px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 450px;
  }
}
@media only screen and (min-height: 550px) and (max-height: 599px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 500px;
  }
}
@media only screen and (min-height: 600px) and (max-height: 799px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 550px;
  }
}
@media only screen and (min-height: 800px) and (max-height: 899px) {
  .uv.en-gb .overlays > div.multiSelect .content {
    height: 750px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 640px) {
  .uv.en-gb .overlay.login {
    left: 10% !important;
    width: 80% !important;
  }
  .uv.en-gb .overlay.login p.message {
    height: auto !important;
  }
}
