@font-face {
  font-family: MuseoSans;
  font-weight: 100;
  font-style: normal;
  src: url("fonts/MuseoSans_100/MuseoSans_100-webfont.woff") format("woff"), url("fonts/MuseoSans_100/MuseoSans_100-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 100;
  font-style: italic;
  src: url("fonts/MuseoSans_100_italic/MuseoSans_100_Italic-webfont.woff") format("woff"), url("fonts/MuseoSans_100_italic/MuseoSans_100_Italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 300;
  font-style: normal;
  src: url("fonts/MuseoSans_300/MuseoSans_300-webfont.woff") format("woff"), url("fonts/MuseoSans_300/MuseoSans_300-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 300;
  font-style: italic;
  src: url("fonts/MuseoSans_300_italic/MuseoSans_300_Italic-webfont.woff") format("woff"), url("fonts/MuseoSans_300_italic/MuseoSans_300_Italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 500;
  font-style: normal;
  src: url("fonts/MuseoSans_500/MuseoSans_500-webfont.woff") format("woff"), url("fonts/MuseoSans_500/MuseoSans_500-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 500;
  font-style: italic;
  src: url("fonts/MuseoSans_500_italic/MuseoSans_500_Italic-webfont.woff") format("woff"), url("fonts/MuseoSans_500_italic/MuseoSans_500_Italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 700;
  font-style: normal;
  src: url("fonts/MuseoSans_700/MuseoSans_700-webfont.woff") format("woff"), url("fonts/MuseoSans_700/MuseoSans_700-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 700;
  font-style: italic;
  src: url("fonts/MuseoSans_700_italic/MuseoSans_700_Italic-webfont.woff") format("woff"), url("fonts/MuseoSans_700_italic/MuseoSans_700_Italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 900;
  font-style: normal;
  src: url("fonts/MuseoSans_900/MuseoSans_900-webfont.woff") format("woff"), url("fonts/MuseoSans_900/MuseoSans_900-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSans;
  font-weight: 900;
  font-style: italic;
  src: url("fonts/MuseoSans_900_italic/MuseoSans_900_Italic-webfont.woff") format("woff"), url("fonts/MuseoSans_900_italic/MuseoSans_900_Italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 100;
  font-style: normal;
  src: url("fonts/MuseoSlab_100/Museo_Slab_100-webfont.woff") format("woff"), url("fonts/MuseoSlab_100/Museo_Slab_100-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 100;
  font-style: italic;
  src: url("fonts/MuseoSlab_100_italic/Museo_Slab_100italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_100_italic/Museo_Slab_100italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 300;
  font-style: normal;
  src: url("fonts/MuseoSlab_300/Museo_Slab_300-webfont.woff") format("woff"), url("fonts/MuseoSlab_300/Museo_Slab_300-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 300;
  font-style: italic;
  src: url("fonts/MuseoSlab_300_italic/Museo_Slab_300italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_300_italic/Museo_Slab_300italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 500;
  font-style: normal;
  src: url("fonts/MuseoSlab_500/Museo_Slab_500-webfont.woff") format("woff"), url("fonts/MuseoSlab_500/Museo_Slab_500-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 500;
  font-style: italic;
  src: url("fonts/MuseoSlab_500_italic/Museo_Slab_500italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_500_italic/Museo_Slab_500italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 700;
  font-style: normal;
  src: url("fonts/MuseoSlab_700/Museo_Slab_700-webfont.woff") format("woff"), url("fonts/MuseoSlab_700/Museo_Slab_700-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 700;
  font-style: italic;
  src: url("fonts/MuseoSlab_700_italic/Museo_Slab_700italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_700_italic/Museo_Slab_700italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 900;
  font-style: normal;
  src: url("fonts/MuseoSlab_900/Museo_Slab_900-webfont.woff") format("woff"), url("fonts/MuseoSlab_900/Museo_Slab_900-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 900;
  font-style: italic;
  src: url("fonts/MuseoSlab_900_italic/Museo_Slab_900italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_900_italic/Museo_Slab_900italic-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 1000;
  font-style: normal;
  src: url("fonts/MuseoSlab_1000/Museo_Slab_1000-webfont.woff") format("woff"), url("fonts/MuseoSlab_1000/Museo_Slab_1000-webfont.ttf") format("truetype"); }

@font-face {
  font-family: MuseoSlab;
  font-weight: 1000;
  font-style: italic;
  src: url("fonts/MuseoSlab_1000_italic/Museo_Slab_1000italic-webfont.woff") format("woff"), url("fonts/MuseoSlab_1000_italic/Museo_Slab_1000italic-webfont.ttf") format("truetype"); }

html, body {
  font-feature-settings: "onum" 1, "pnum" 1, "frac" 1, "kern" 1, "liga" 1, "dlig" 1; }

*, *:before, *:after {
  box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0; }

body {
  background-color: #e4ecf1;
  color: #457EA6;
  font-family: "MuseoSans", Museo Sans, Gill Sans, Helvetica, San Serif;
  font-weight: normal;
  font-size: 100%;
  -webkit-text-size-adjust: 100%; }

html, body {
  font-size: 90%; }

@media only screen and (max-width: 480px) {
  html, body {
    font-size: 3.52vmin; }
  .optional {
    display: none; } }

.squashy {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block; }

h1, h2, h3, h4, h5, h6 {
  color: #395f7a;
  line-height: 1.5; }

a, a * {
  cursor: pointer;
  outline: none; }

a {
  color: #457EA6;
  text-decoration: none; }
  a:hover:not(.icon) {
    text-decoration: underline; }

a:focus {
  text-decoration: underline; }

img {
  max-width: 100%; }

a img {
  border: 0; }

a, p, h1, h2, h3, h4, h5 {
  margin: 0 0 1em 0;
  line-height: 1.6em; }
  a svg, p svg, h1 svg, h2 svg, h3 svg, h4 svg, h5 svg {
    width: 1em;
    height: 1em;
    margin-top: -0.5ex;
    vertical-align: middle; }

p {
  line-height: 1.6em; }

h1 {
  font-size: 120%;
  font-weight: normal;
  margin: 10px 0; }
  h1 svg {
    width: 1.5em;
    height: 1.5em; }

.spin.icon > svg {
  animation-name: spin;
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

@keyframes spin {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(360deg); } }

h2 {
  padding-top: 3px;
  padding-bottom: 10px;
  margin-bottom: 4px;
  font-size: 90%; }

h3 {
  padding: 0;
  margin: 0;
  font-size: 90%; }

h4 {
  margin: 0 0 0.5em 0;
  font-weight: bold;
  font-size: 14px; }

h5 {
  margin: 0 0 0.5em 0;
  font-weight: bold;
  font-size: 80%; }

input[type=password], input[type=text] {
  font-weight: 500;
  font-family: "MuseoSlab", Museo Sans, Gill Sans, Helvetica, San Serif; }

div.text-input {
  width: calc(100% - 2ex);
  border: 1px solid #457EA6;
  border-radius: 0.5ex;
  padding: 1ex; }
  div.text-input input[type='text'] {
    border: none;
    outline: none;
    font-size: 1.7ex;
    color: #457EA6;
    width: 100%;
    font-size: 100%; }

a.button {
  display: inline-block;
  background-color: #457EA6;
  font-size: 100%;
  color: white;
  padding: 1ex 2ex 1ex 2ex;
  border-radius: 0.5ex;
  text-decoration: none; }
  a.button:hover {
    text-decoration: none;
    background-color: #395f7a; }
  a.button:active {
    background-color: #323233; }

button {
  border: 0;
  width: auto;
  overflow: visible;
  border-style: solid;
  outline: 0; }

form {
  padding: 0;
  margin: 0; }

label {
  cursor: default; }

table {
  border-collapse: collapse; }

span.nowrap {
  white-space: nowrap; }

svg path {
  fill: #457EA6; }
  svg path.darker {
    fill: #395f7a; }
  svg path.white {
    fill: white; }

svg.icon {
  width: 4ex;
  height: 4ex; }
  svg.icon.small {
    width: 3ex;
    height: 3ex; }

#dev-mode {
  width: 130px;
  height: 130px;
  position: fixed;
  z-index: 999999999;
  top: 0;
  left: 0;
  overflow: hidden;
  pointer-events: none;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }
  #dev-mode #dev-mode-banner {
    position: absolute;
    top: calc(50% - 38px);
    left: -38px;
    width: 130%;
    height: 36px;
    background-color: #E25A5A;
    color: #fff;
    padding: 10px;
    text-align: center;
    font-size: 12px;
    text-transform: uppercase;
    line-height: 16px;
    transform: rotate(-45deg);
    overflow: hidden;
    box-sizing: border-box;
    -webkit-box-sizing: border-box; }
    #dev-mode #dev-mode-banner:before, #dev-mode #dev-mode-banner:after {
      content: '';
      position: absolute;
      height: 200%;
      width: 8px;
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzc1NzU3NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3NTc1NzUiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
      background: -moz-linear-gradient(left, #585858 0%, rgba(117, 117, 117, 0) 100%);
      background: -webkit-linear-gradient(left, #585858 0%, rgba(117, 117, 117, 0) 100%);
      background: linear-gradient(to right, #585858 0%, rgba(117, 117, 117, 0) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#757575', endColorstr='#00757575',GradientType=1 ); }
    #dev-mode #dev-mode-banner:before {
      left: 21px;
      top: -19px;
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    #dev-mode #dev-mode-banner:after {
      right: 24px;
      top: -20px;
      -ms-transform: rotate(-225deg);
      transform: rotate(-225deg); }

nav, .crumbs-and-download-all, .search, .file {
  padding: 1ex; }

img.avatar {
  width: 2em;
  height: 2em;
  border-radius: 2em;
  margin-right: 1ex;
  border: 1px solid #cddeea !important; }

.topbar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px 0px;
  z-index: 100; }
  .topbar td {
    padding: 1ex; }
  .topbar .logo {
    text-align: left; }
    .topbar .logo img.logo {
      height: 5ex; }
  .topbar .search {
    text-align: right;
    position: relative;
    margin-right: 1em;
    padding: 1ex 1ex 2.5ex 5ex;
    border-radius: 1ex;
    border: 1px solid #cddeea !important; }
    .topbar .search input[type='text'] {
      border: none;
      outline: none;
      position: absolute;
      top: 0.2ex;
      right: 1ex;
      bottom: 0.2ex;
      left: 4.5ex;
      font-size: 1.7ex;
      color: #457EA6; }
    .topbar .search .icon {
      position: absolute;
      top: 0.1ex;
      left: 0.3ex;
      width: 3ex; }

.main {
  width: 100%;
  z-index: -100;
  padding-bottom: 3em;
  padding: calc( 5ex + 1ex * 2 + 2em) 2em 2em 2em; }
  .main.invalid {
    padding: calc( 5ex + 1ex * 2 + 4em) 4em 4em 4em; }
  .main .description {
    font-size: 120%;
    padding: 1ex;
    max-width: 960px;
    margin: auto; }
  .main .contents {
    background-color: white;
    max-width: 960px;
    margin: auto;
    border-radius: 8px;
    padding: 1em;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px 0px;
    position: relative; }
    .main .contents .nav {
      width: 100%;
      height: 3em; }
      .main .contents .nav .prev {
        text-align: left;
        width: 12ex; }
        .main .contents .nav .prev svg.prev {
          height: 1.5ex;
          width: 1ex;
          display: inline-block; }
          .main .contents .nav .prev svg.prev path.prev {
            display: none; }
      .main .contents .nav .pagecount {
        text-align: center; }
      .main .contents .nav .next {
        text-align: right;
        width: 12ex; }
        .main .contents .nav .next svg.next {
          height: 1.5ex;
          width: 1ex;
          display: inline-block; }
          .main .contents .nav .next svg.next path.next {
            display: none; }
    .main .contents .crumbs-and-download-all {
      width: 100%; }
      .main .contents .crumbs-and-download-all td {
        text-align: left;
        vertical-align: middle; }
        .main .contents .crumbs-and-download-all td .avatar {
          min-width: 5ex;
          min-height: 5ex; }
      .main .contents .crumbs-and-download-all .crumbs {
        width: 100%;
        text-align: right;
        overflow-x: hidden; }
        .main .contents .crumbs-and-download-all .crumbs .crumb {
          padding-right: 0.5ex; }
          .main .contents .crumbs-and-download-all .crumbs .crumb.next {
            width: 1ex; }
        .main .contents .crumbs-and-download-all .crumbs svg.next {
          height: 1.5ex;
          width: 1ex;
          display: inline-block; }
          .main .contents .crumbs-and-download-all .crumbs svg.next path.next {
            display: none; }
        .main .contents .crumbs-and-download-all .crumbs .spacer {
          width: 100%; }
      .main .contents .crumbs-and-download-all .download-all {
        width: 100%; }
        .main .contents .crumbs-and-download-all .download-all td {
          text-align: right; }
          .main .contents .crumbs-and-download-all .download-all td.text {
            min-width: 21ex; }
          .main .contents .crumbs-and-download-all .download-all td.icon {
            width: 4ex; }
            .main .contents .crumbs-and-download-all .download-all td.icon svg {
              display: inline-block;
              width: 2em; }
    .main .contents .plug {
      position: absolute;
      position: absolute;
      bottom: -2em;
      right: 1.5em;
      font-size: 80%; }
    .main .contents .pages {
      background-color: #cddeea;
      text-align: center; }
      .main .contents .pages .page {
        padding: 1ex;
        border-radius: 1ex; }
    .main .contents .preview {
      padding-top: 1ex;
      display: flex;
      align-items: center;
      justify-content: center; }
      .main .contents .preview.video, .main .contents .preview.image, .main .contents .preview.document {
        max-width: calc( 960px - 1ex * 2); }
        .main .contents .preview.video video, .main .contents .preview.video img, .main .contents .preview.image video, .main .contents .preview.image img, .main .contents .preview.document video, .main .contents .preview.document img {
          max-width: calc( 960px - 1ex * 4); }
      .main .contents .preview.document .pages {
        background-color: white; }
        .main .contents .preview.document .pages .page {
          border-radius: 0; }
        .main .contents .preview.document .pages img {
          box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
          background-color: white; }
          .main .contents .preview.document .pages img:not(:last-child) {
            margin-bottom: 1ex; }
    .main .contents .no-results {
      margin: 1em; }
  @media only screen and (max-width: 480px) {
    .main .description, .main .contents {
      max-width: calc(480px - 1ex * 2); } }

.line {
  border-bottom: 1px solid #e4ecf1; }

.tiny {
  font-size: 80%;
  color: #aaa;
  margin: 0;
  padding-bottom: 1.5ex; }

img.icon {
  width: 4ex;
  height: 4ex; }

table.assets {
  width: 100%;
  margin-top: 1em; }
  table.assets th {
    font-weight: normal;
    font-size: 100%;
    color: #457EA6; }
  table.assets th, table.assets td {
    text-align: left;
    padding: 1ex; }
    table.assets th:last-child, table.assets td:last-child {
      text-align: right;
      width: 11ex; }
  table.assets tr.folder td, table.assets tr.file td {
    border-top: 1px solid #e4ecf1; }
  table.assets tr.folder td.icon, table.assets tr.file td.icon {
    width: 6ex;
    min-width: 5ex;
    min-height: 5ex; }
    table.assets tr.folder td.icon img, table.assets tr.file td.icon img {
      border-radius: 0.5ex; }
  table.assets tr:nth-child(2) td {
    border-color: #cddeea; }

.download {
  padding-top: 1em; }

.button {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px 0px; }

.preview > a {
  max-width: 100%; }