.browser {

}

.browser .browser-tabs {
  border-bottom-style: none;
  margin-bottom: 0;
}

.browser .browser-tabs li:only-child {
  display: none;
}

.browser .browser-tabs .active .browser-tab {
  border-bottom-color: #ddd;
}

.browser .container-fluid {
  padding: 0;
}

.browser .well {
  padding: 8px 12px;
  margin-top: 10px;
  margin-bottom: 0;
}

.browser-nav-breadcrumb .breadcrumb {
  margin-bottom: 0;
  padding: 0;
}

.browser-nav-tree > .nav-list {
  padding: 0 5px;
}

.browser-nav-tree .nav-list .nav-list {
  padding-right: 0;
}

.browser-nav-tree .browser-folder {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.browser-viewport-toolbar .btn.btn-large i {
  width: 1em;
  display: inline-block;
}

.browser-viewport-toolbar .btn-toolbar .btn-group.pull-right + .btn-group.pull-right {
  margin-left: 0;
  margin-right: 5px;
}

.browser-viewport .browser-view-pane {
  display: none;
}

.browser-viewport .browser-view-pane.active {
  display: block;
}

.browser-component-toggle .browser-folders {
  display: none;
}

.browser-component-toggle .browser-view-grid li.nav-header:first-child,
.browser-component-toggle .browser-view-grid li.nav-header:first-child + li,
.browser-component-toggle .browser-view-list li.nav-header:first-child,
.browser-component-toggle .browser-view-list li.nav-header:first-child + li {
  display: none;
}

.browser-view-grid {
  padding: 0 5px;
}

/*
  siebennull.com/equal_width_height.html
*/

.browser-view-grid .browser-folders,
.browser-view-grid .browser-files {
  margin-left: 0;
  margin-right: 0;
  list-style: none;
  display: flex;
  flex-flow: row wrap;
  box-sizing: border-box;
}

.browser-view-grid .browser-folders li,
.browser-view-grid .browser-files li {
  position: relative;
  margin: 5px;
  width: calc((100% / 4) - 11px);
  box-sizing: border-box;
}

.browser-view-grid .browser-folder {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 8px 12px;
  color: #444444;
  background-color: #ffffff;
  border: solid 3px #eeeeee;
  box-sizing: border-box;
}

.browser-view-grid .browser-folder:hover,
.browser-view-grid .browser-folder:focus {
  color: #ffffff;
  background-color: #0088cc;
}

.browser-view-grid .browser-file {
  position: relative;
  display: block;
  overflow: hidden;
  background-color: #ffffff;
  border: solid 3px #eeeeee;
  box-sizing: border-box;
}

.browser-view-list .browser-file-thumbnail-container {
  position: relative;
}

.browser-view-grid .browser-file:hover {
  border-color: #0088cc;
}

.browser-view-grid .browser-file.active {
  border-color: #398f28;
}

.browser-view-grid .browser-file .browser-item-select {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 2px;
  font-size: 20px;
  line-height: 20px;
  margin-top: -12px;
  margin-left: -12px;
  display: none;
  border-radius: 50%;
  background-color: rgba(225,225,225,0.75);
}

.browser-view-grid .browser-file:hover .browser-item-select {
  display: inline-block;
  color: #555555;
}

.browser-view-grid .browser-file.active .browser-item-select {
  display: inline-block;
  color: #398f28;
}

.browser-view-list {
  padding: 0 5px;
  margin-left: 0;
  margin-right: 0;
}

.browser-view-list .browser-folders li,
.browser-view-list .browser-files li {
  line-height: 40px;
}

.browser-view-list .browser-folder,
.browser-view-list .browser-folder:focus,
.browser-view-list .browser-file,
.browser-view-list .browser-file:focus {
  color: #444444;
  background-color: #ffffff;
  border-bottom: solid 1px #eeeeee;
}

.browser-view-list .browser-folders li:first-child .browser-folder,
.browser-view-list .browser-files li:first-child .browser-file {
  border-top: solid 1px #eeeeee;
}

.browser-view-list .browser-folder [class*="icon-"],
.browser-view-list .browser-file [class*="icon-"] {
  font-size: large;
}

.browser-view-list .browser-file-thumbnail-container {
  position: relative;
  display: inline-block;
  width: 48px;
  height: auto;
  margin-right: 5px;
  margin-bottom: 2px;
  vertical-align: middle;
  background-color: #ffffff;
  border: solid 3px #eeeeee;
  box-sizing: border-box;
}

.browser-view-list .browser-folder:hover,
.browser-view-list .browser-file:hover {
  color: #ffffff;
  background-color: #0088cc;
}

.browser-view-list .browser-file.active {
  color: #ffffff;
  background-color: #398f28;
}

.browser-file-thumbnail-aspect-ratio {
  display: block;
  width: 100%;
  padding-bottom: 75%;
}

.browser-file-thumbnail {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}