/* Styles and media queries are created for exclusive use in box-content-preview external library,
 and that's why they are not related to the _media_queries.scss file.
 In their documentation, Box.inc published "Limited support for mobile web -
 previews will render but some controls may not work" */

@media only screen and (min-width: 381px) and (max-width: 726px) {
  .bp-container .bp-controls .bp-page-num-wrapper {
    padding: 7px 3px;
  }
}
@media only screen and (max-width: 380px) {
  .bp-container .bp-controls .bp-page-num-wrapper {
    padding: 7px 3px;
  }
  .bp-container{
    min-width: 200px;
  }
  .bp-container .bp-controls-btn {
    width: 32px;
    height: 32px;
  }
  .bp-container .bp-controls-group {
    margin: 0;
  }
  .bp-container .bp-controls .bp-page-num-wrapper {
    padding: 0;
  }
  .bp-container .bp-ZoomControls-currentScale {
    min-width: 32px;
  }
  .bp-container .bp-page-num-input{
    padding: 0px 7px;
  }
  .bp-container .bp-find-bar .bp-doc-find-field {
    width: 140px;
  }
}
@media only screen and (max-width: 300px) {
  .bp-container .bp-controls-group .bp-controls-group-btn {
    width: 15px;
  }
}