/* bin theme
 */

.jotted-nav-item,
.jotted-pane {
  box-sizing: border-box;
}

.jotted-theme-bin {
  overflow: hidden;
}

.jotted-theme-bin .jotted-nav {
  clear: both;
}

.jotted-theme-bin .jotted-nav-item {
  background: transparent;
  pointer-events: none;

  text-align: center;
}

.jotted-theme-bin .jotted-nav-item,
.jotted-theme-bin .jotted-pane {
  border-width: 0 1px 0 0;
  border-style: solid;
  border-color: #ddd;
}

.jotted-theme-bin .jotted-pane:last-child {
  border: 0;
}

.jotted-theme-bin .jotted-pane-result,
.jotted-theme-bin.jotted-has-html .jotted-pane-html,
.jotted-theme-bin.jotted-has-css .jotted-pane-css,
.jotted-theme-bin.jotted-has-js .jotted-pane-js {
  position: relative;
  float: left;
  visibility: visible;
}

.jotted-theme-bin .jotted-pane-result,
.jotted-theme-bin .jotted-nav-item {
  width: 100%;
}

/* widths
 */

.jotted-theme-bin.jotted-has-html .jotted-nav-item,
.jotted-theme-bin.jotted-has-css .jotted-nav-item,
.jotted-theme-bin.jotted-has-js .jotted-nav-item,
.jotted-theme-bin.jotted-has-html .jotted-pane,
.jotted-theme-bin.jotted-has-css .jotted-pane,
.jotted-theme-bin.jotted-has-js .jotted-pane {
  width: 50%;
}

.jotted-theme-bin.jotted-has-html.jotted-has-css .jotted-nav-item,
.jotted-theme-bin.jotted-has-html.jotted-has-js .jotted-nav-item,
.jotted-theme-bin.jotted-has-css.jotted-has-js .jotted-nav-item,
.jotted-theme-bin.jotted-has-html.jotted-has-css .jotted-pane,
.jotted-theme-bin.jotted-has-html.jotted-has-js .jotted-pane,
.jotted-theme-bin.jotted-has-css.jotted-has-js .jotted-pane {
  width: 33.33%;
}

.jotted-theme-bin.jotted-has-html.jotted-has-css.jotted-has-js .jotted-nav-item,
.jotted-theme-bin.jotted-has-html.jotted-has-css.jotted-has-js .jotted-pane {
  width: 25%;
}

/* console plugin support
 */

.jotted-theme-bin .jotted-pane-console {
  position: relative;
  float: left;
  visibility: visible;
}

.jotted-plugin-console.jotted-theme-bin.jotted-has-html .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-css .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-js .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-html .jotted-pane,
.jotted-plugin-console.jotted-theme-bin.jotted-has-css .jotted-pane,
.jotted-plugin-console.jotted-theme-bin.jotted-has-js .jotted-pane {
  width: 33.33%;
}

.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-css .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-js .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-css.jotted-has-js .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-css .jotted-pane,
.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-js .jotted-pane,
.jotted-plugin-console.jotted-theme-bin.jotted-has-css.jotted-has-js .jotted-pane {
  width: 25%;
}

.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-css.jotted-has-js .jotted-nav-item,
.jotted-plugin-console.jotted-theme-bin.jotted-has-html.jotted-has-css.jotted-has-js .jotted-pane {
  width: 20%;
}
