body {
    overflow-y: scroll;
}

.small {
    font-size: .75em;
}

h2 {
    font-size: 24px;
    line-height: 48px;
}

h4 i {
    color: #ddd;
}

#encoderwarning {
    background-color: #eee;
    margin: 1em 0;
    padding: .5em 1em;
    font-size: 15px;
    line-height: 30px;
}

.hidden {
    display: none !important;
}

.clickable {
    cursor: pointer;
}

#time {
    color: #eee;
    font-size: 1.5em;
    font-family: monospace;
}

button {
    width: initial;
    display: inline-block;
    margin-right: .5em;
}

.bottomspace {
    margin-bottom: 100px;
}

.loginbox {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 5em;
    background-color: #eee;
    background-image: url('/media/film.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: contain;
}

.loginbox.tarantino {
    background-image: url('/media/quentintarantino.png');
}

.brandlogo {
    display: inline-block;
    margin: 0;
    width: 32px;
    height: 32px;
    background-image: url(data:image/png;base64,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);
    background-repeat: no-repeat;
    background-size: contain;
}

.t1 {
    border: #777 1px solid;
    font-size: .9em;
    border-collapse: separate;
    table-layout: auto;
}

.t1 th {
    background-color: #eee;
    font-size: .75em;
}

.t1 td {
    border-color: #777;
}

.t1 td.fixed {
    width: 200px;
}

.t1 td.kalturalogo20 {
    cursor: pointer;
}

.t1 tr.match-a td {
    border-bottom: none;
}

tr.offline, tr.red {
    background-color: #ffe1e1;
}

tr.error {
    background-color: red;
    color: #fff !important;
}

.warning {
    border: #ccc 1px solid;
    margin: 1em 0;
    padding: .5em 1em;
    background-color: #ffdddd !important;
}

.grey {
    color: #ddd;
}

#counter {
    font-family: monospace;
    color: #ddd;
}

.fullscreen {
    background-color: #eee;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 1em;
    text-align: center;
    z-index: 10;
}

.fullscreen h4 {
    background-color: #eee;
    border: #ccc 1px solid;
    padding: .5em;
    display: inline;
    position: fixed;
    right: 1em;
    bottom: 1em;
    z-index: 2000;
}

h4.error {
    color: #ff0000;
}

h4.error:before {
    content: '[errors detected] ';
}

#encoderboxes {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 2em;
}

#encoderboxes > div {
    width: 220px;
    height: 124px;
    background-color: #eee;
    border: #000 1px solid;
    margin: 2px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

#encoderboxes > div > img {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 50;
}

#encoderboxes div.encoderdata {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    color: #fff;
    z-index: 55;
}

#encoderboxes div.encoderdata.offline {
    background: url(data:image/png;base64,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) center center no-repeat, linear-gradient(rgba(200,0,0,1) 0%, rgba(40,0,0,1) 100%);
}

#encoderboxes div.encoderdata.inactive {
    background: url(data:image/png;base64,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) center center no-repeat, linear-gradient(rgba(200,200,200,1) 0%, rgba(80,80,80,1) 100%);
}

#encoderboxes div.encoderdata p.toprow {
    margin: 0;
    padding: .2em;
    line-height: 1em;
    font-family: monospace;
    font-size: .9em;
    text-align: left;
    color: #fff;
}

#encoderboxes div.encoderdata p.bottomrow {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: .2em;
    line-height: 1em;
    text-align: right;
    color: #fff;
}

#encoderboxes p.bottomrow span.code {
    font-size: 1.25em;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.75);
    text-shadow: 0px 0px 5px #000;
}

#encoderboxes div.encoderdata .number {
    display: inline-block;
    background-color: #777;
    width: 2em;
    height: 2em;
    line-height: 2em;
    text-align: center;
    border-radius: 50%;
    font-size: .7em;
}

#encoderboxes div.encoderdata.recording .number {
    background-color: red;
}

#encoderboxes div.encoderdata span.recinfo {
    float: right;
    text-shadow: 0px 0px 15px #000;
}

.logtext {
    font-family: 'Andale Mono', monospace;
    font-size: 12px;
    white-space: pre;
    padding: 1em;
    background-color: #efefef;
    overflow-x: scroll;
    overflow-y: auto;
}

#videoplayer {
    width: 100%;
}

/* Events */

#eventcontainer {
    background: #eee;
    overflow: hidden;
}

.event {
    display: flex;
    align-items: center;
    background-color: #fff;
    border: #aaa 1px solid;
    margin: 1em;
    padding: .5em 1em;
    box-shadow: 5px 5px 20px 0px rgba(0,0,0,0.5);
}

.event.future {
    opacity: 0.5;
}

.event p {
    margin: .1em;
    padding: .1em;
}

.eventdate {
    background-color: #004000;
    padding: .5em;
    text-align: center;
    border-radius: .5em;
}

.nomatch .eventdate {
    background-color: #c00000;
}

.future .eventdate {
    background-color: #ccc;
}

.eventdate p {
    color: #fff;
    line-height: 1em;
}

.eventdate p .day {
    font-size: 1.75em;
}

.eventdate p .month {
    text-transform: uppercase;
}

.eventinfo {
    padding: .5em;
    overflow: hidden;
}

.eventinfo i {
    color: #555;
    margin: 0 .2em;
}

.eventinfo p {
    max-width: 100%;
    font-size: .85em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.eventinfo p span {
    font-size: .7em;
    background-color: #eee;
    padding: .2em 1em;
    border-radius: 10px;
}