html { height: 100%; }
body {
    height: 100%;
    font-family: '-apple-system', 'Segoe UI', 'HelveticaNeue', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #444;
    background: #F6F6F8;
    padding: 0;
    margin: 0;
    opacity: 0;
}
body.loaded { opacity: 1; }
.no-click { pointer-events: none; }
.error { color: #D50000; }

/* Buttons and Inputs */
.btn { font-size: 15px; padding: 8px 16px; border-radius: 2px; border: 1px solid rgba(0,0,0,0); }
.btn-spruce-primary,
.btn-spruce-primary:hover,
.btn-spruce-primary:focus { background: #4CAF50; color: white; }
.btn-spruce-primary:active { background: #43A047; }

/* Version */
.version {
    position: absolute;
    bottom: 15px;
    left: 15px;
    font-size: 13px;
    color: darkgray;
}

/* Entry */
#entry .logo-container {
    width: 240px;
    padding-top: 20%;
    margin-right: auto;
    margin-left: auto;
}
#entry .logo {
    width: 240px;
    height: 120px;
}

/* Login */
#LoginPanel #LoginButton { color: white; background: #F5333F; }
#LoginPanel .logo-container { padding: 30px 0 30px 0; text-align: center; }
#LoginPanel .logo { width: 240px; height: 120px; }

/* Navigation */
#header-nav {
    height: 80px;
    background: white;
    border-bottom: 1px solid #EEEEEF;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#header-nav table { width: 100%; height: 80px; }
#header-nav td { vertical-align: middle; }
#header-nav td.nav-cell { width: 100%; text-align: right; }
#header-nav .logo { width: 120px; height: 60px; }
#header-nav .nav-item {
    display: inline-block;
    color: #AAA;
    text-align: center;
    padding: 15px;
    cursor: pointer;
    -webkit-transition: color .35s ease;
    -moz-transition: color .35s ease;
    -ms-transition: color .35s ease;
    transition: color .35s ease;
}
#header-nav .nav-item:hover { color: #888; }
#header-nav .nav-item.selected { color: #F5333F; }
#header-nav .nav-item .text { font-size: 13px; font-weight: 400; line-height: 1; margin-top: 2px; }
@media (min-width: 768px) {
    #header-nav,
    #header-nav table { height: 100px; }
    #header-nav td { padding-top: 8px; }
}

/* Status */
#status-table { width: 100%; }
#status-table tr:first-child td { border-top: 0; }
#status-table td { padding-top: .5rem; padding-bottom: .5rem; }
#status-table td.item { width: 30%; font-weight: 600; padding-left: 0 !important; }
#status-table td.value { width: 70%; }

/* Cast */
#cast-view { width: 100%; height: 100%; background: white; border: 0; border-radius: 4px; }

/* Animation overrides */
.collapsing {
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
}