@charset "utf-8";

/*
Hive Metrium System
Copyright (c) 2008-2020 Hive Solutions Lda.

This file is part of Hive Metrium System.

Hive Metrium System is free software: you can redistribute it and/or modify
it under the terms of the Apache License as published by the Apache
Foundation, either version 2.0 of the License, or (at your option) any
later version.

Hive Metrium System is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
Apache License for more details.

You should have received a copy of the Apache License along with
Hive Metrium System. If not, see <http://www.apache.org/licenses/>.
*/

/*
__author__    = João Magalhães <joamag@hive.pt>
__version__   = 1.0.0
__revision__  = $LastChangedRevision$
__date__      = $LastChangedDate$
__copyright__ = Copyright (c) 2008-2020 Hive Solutions Lda.
__license__   = Apache License, Version 2.0
*/

body.fullscreen {
    background: #000000 url(../images/background.png) repeat;
    color: #ffffff;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 1920px;
}

body.fullscreen .window {
    box-shadow: none;
    -o-box-shadow: none;
    -ms-box-shadow: none;
    -moz-box-shadow: none;
    -khtml-box-shadow: none;
    -webkit-box-shadow: none;
    color: #4d4d4d;
}

body.fullscreen #overlay {
    background-color: #1d1d1d;
    opacity: 0.95;
    -o-opacity: 0.95;
    -ms-opacity: 0.95;
    -moz-opacity: 0.95;
    -khtml-opacity: 0.95;
    -webkit-opacity: 0.95;
}

.error-panel {
    display: none;
    height: 300px;
    position: absolute;
    text-align: center;
    width: 420px;
    z-index: 30;
}

.error-panel > .logo {
    background: transparent url(../images/logo.png) no-repeat center center;
    height: 120px;
}

.error-panel > h1 {
    color: #ffffff;
    font-size: 52px;
    font-weight: 300;
    line-height: 58px;
    margin: 8px 0px 8px 0px;
}

.error-panel > h2 {
    color: rgba(255, 255, 255, 0.4);
    font-size: 34px;
    font-weight: 300;
    margin: 8px 0px 8px 0px;
}

div.info,
.marker.info {
    color: #3668c6;
}

div.success,
.marker.success {
    color: #32951b;
}

div.warning,
.marker.warning {
    color: #ea7a15;
}

div.error,
.marker.error {
    color: #c31f30;
}

.sound {
    display: none;
}

.dashboard {
    font-size: 32px;
    text-align: left;
}

.dashboard > .video {
    background-color: #000000;
    border: 1px solid rgba(255, 255, 255, 0.4);
    display: none;
    position: absolute;
    z-index: 30;
}

.dashboard > .message {
    color: #ffffff;
    display: none;
    font-size: 30px;
    font-weight: 300;
    height: 49px;
    line-height: 49px;
    margin-top: 9px;
    overflow: hidden;
    padding: 6px 32px 6px 32px;
    position: absolute;
    text-align: center;
    width: 1856px;
}

.dashboard > .message.info {
    background-color: rgba(50, 131, 164, 0.6);
}

.dashboard > .message.success {
    background-color: rgba(108, 162, 44, 0.6);
}

.dashboard > .message.warning {
    background-color: rgba(184, 146, 50, 0.6);
}

.dashboard > .message.error {
    background-color: rgba(166, 64, 61, 0.6);
}

.dashboard > .message > .author {
    font-weight: normal;
}

.dashboard > .message > .separator {
    font-weight: normal;
    margin: 0px 12px 0px 12px;
}

.dashboard .header {
    background: transparent url(../images/transparent-black.png) repeat;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    height: 150px;
}

.dashboard .header .logo {
    background: transparent url(../images/logo_header.png) repeat;
    background-size: cover;
    border-right: 1px solid rgba(255, 255, 255, 0.4);
    float: left;
    height: 150px;
    width: 370px;
}

.dashboard .header .sections {
    float: left;
}

.dashboard ul.sections {
    height: 150px;
    margin: 0px 0px 0px 0px;
    padding-left: 82px;
}

.dashboard ul.sections li {
    border-bottom: 3px solid transparent;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    display: inline;
    line-height: 150px;
    margin: 0px 0px 0px 0px;
    margin-right: 98px;
    padding: 0px 0px 4px 0px;
    transition: color 0.10s linear, border-color 0.10s linear;
    -o-transition: color 0.10s linear, border-color 0.10s linear;
    -ms-transition: color 0.10s linear, border-color 0.10s linear;
    -moz-transition: color 0.10s linear, border-color 0.10s linear;
    -khtml-transition: color 0.10s linear, border-color 0.10s linear;
    -webkit-transition: color 0.10s linear, border-color 0.10s linear;
}

.dashboard ul.sections li.active {
    border-bottom-color: #ffffff;
    color: #ffffff;
}

.dashboard ul.sections li:hover {
    background-color: transparent;
    color: #ffffff;
}

.dashboard .frame {
    font-size: 0px;
    height: 770px;
    margin: 79px 0px 80px 0px;
}

.dashboard .frame > * {
    display: inline-block;
    font-size: 32px;
    vertical-align: top;
}

.dashboard .frame .context {
    border-right: 1px solid rgba(255, 255, 255, 0.4);
    height: 770px;
    width: 370px;
}

.dashboard .frame.full .context {
    display: none;
}

.dashboard .frame .context .news {
    height: 601px;
    overflow: hidden;
}

.dashboard .frame .boards {
    width: 1549px;
}

.dashboard .frame.full .boards {
    width: 100%;
}

.dashboard .frame .board {
    height: 770px;
    margin: 0px 80px 0px 80px;
}

.dashboard .line {
    height: 383px;
    margin-bottom: 4px;
}

.dashboard .line:last-child {
    margin-bottom: 0px;
}

.dashboard .box {
    background: transparent url(../images/transparent-white.png) repeat;
    float: left;
    height: 383px;
    margin-right: 4px;
    width: 460px;
}

.dashboard .box.double {
    width: 924px;
}

.dashboard .box.triple {
    width: 1388px;
}

.dashboard .box.full {
    height: 770px;
    width: 100%;
}

.dashboard .box.inline {
    font-size: 0px;
}

.dashboard .box:last-child {
    margin-right: 0px;
}

.side {
    display: inline-block;
    font-size: inherit;
    vertical-align: top;
    width: 50%;
}

.side > h3 {
    color: #ffffff;
    font-size: 46px;
    font-weight: 600;
    margin: 36px 0px 36px 0px;
    text-align: center;
}

.side > ul {
    font-size: 36px;
    font-weight: normal;
    margin: 0px 0px 0px 0px;
    padding: 0px 28px 0px 28px;
}

.side > ul li {
    list-style: disc;
    margin-left: 32px;
}

.side > ul li:hover {
    background-color: transparent;
}

.dashboard .date {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    font-weight: 300;
    height: 168px;
    padding: 0px 20px 0px 20px;
}

.dashboard .date .week-day {
    color: rgba(255, 255, 255, 0.3);
    font-size: 52px;
    line-height: 60px;
}

body.romantic .dashboard .date .week-day {
    font-size: 48px;
}

.dashboard .date .day {
    color: rgba(255, 255, 255, 0.3);
    font-size: 40px;
    line-height: 46px;
}

body.romantic .dashboard .date .day {
    font-size: 36px;
}

.dashboard .date .time {
    font-size: 40px;
    line-height: 46px;
}

body.romantic .dashboard .date .time {
    font-size: 36px;
}

.dashboard .news-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    font-weight: 300;
    padding: 14px 12px 14px 20px;
}

.dashboard .news-item:last-child {
    border-bottom: none;
}

.dashboard .news-item .title {
    font-size: 22px;
    margin-bottom: 4px;
}

.dashboard .news-item > .title .time {
    color: rgba(255, 255, 255, 0.3);
    margin-right: 4px;
}

.dashboard .news-item > .title .message {
    color: rgba(255, 255, 255, 0.6);
}

.dashboard .news-item > .title .marker {
    background: transparent url(../images/markers.png) no-repeat 0px 0px;
    display: block;
    float: right;
    height: 16px;
    margin-top: 8px;
    width: 16px;
}

.dashboard .news-item > .title .marker.red,
.dashboard .news-item > .title .marker.error {
    background-position: 0px 0px;
}

.dashboard .news-item > .title .marker.green,
.dashboard .news-item > .title .marker.success {
    background-position: 0px -16px;
}

.dashboard .news-item > .title .marker.blue,
.dashboard .news-item > .title .marker.info {
    background-position: 0px -32px;
}

.dashboard .news-item > .title .marker.orange,
.dashboard .news-item > .title .marker.warning {
    background-position: 0px -48px;
}

.dashboard .news-item > .message {
    color: rgba(255, 255, 255, 0.6);
    font-size: 16px;
    font-weight: normal;
    line-height: 26px;
}

.dashboard .box-contents {
    padding: 20px 38px 20px 38px;
}

.dashboard .box h1 {
    color: rgba(255, 255, 255, 0.4);
    font-size: 38px;
    line-height: 46px;
    margin: 0px 0px 0px 0px;
    text-transform: lowercase;
}

.dashboard .box h2 {
    color: #ffffff;
    font-size: 30px;
    font-weight: 300;
    line-height: 38px;
    margin: 0px 0px 0px 0px;
    text-transform: lowercase;
}

.dashboard .box table {
    width: 384px;
}

.dashboard .box table th {
    color: rgba(255, 255, 255, 0.4);
    font-size: 26px;
    font-weight: 300;
    padding: 6px 0px 6px 0px;
}

.dashboard .box table th.marker {
    max-width: 32px;
    min-width: 32px;
    width: 32px;
}

.dashboard .box table td {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    padding: 6px 0px 6px 0px;
}

.dashboard .box table th.value {
    max-width: 90px;
    min-width: 90px;
    text-align: right;
    width: 90px;
}

.dashboard .box table td.value {
    font-size: 20px;
    font-weight: 600;
    text-align: right;
}

.dashboard .box table td.marker {
    max-width: 32px;
    min-width: 32px;
    text-align: right;
    width: 32px;
}

.dashboard .box table td.marker > div {
    background: transparent url(../images/arrows.png) no-repeat 0px 0px;
    display: inline-block;
    height: 16px;
    width: 16px;
}

.dashboard .box table td.marker > div.down {
    background-position: 0px 0px;
}

.dashboard .box table td.marker > div.up {
    background-position: 0px -16px;
}

.dashboard .box table td.marker > div.down.color {
    background-position: 0px -32px;
}

.dashboard .box table td.marker > div.up.color {
    background-position: 0px -48px;
}

.dashboard .box table td.marker > div.equals {
    background-position: 0px -64px;
}

.dashboard .box .bubble-contents {
    display: inline-block;
    margin-bottom: 8px;
    text-align: center;
    width: 384px;
}

.dashboard .box .bubble-contents.double {
    width: 188px;
}

.dashboard .box .bubble-contents .value {
    background: transparent url(../images/circle_medium.png) no-repeat;
    color: rgba(255, 255, 255, 1);
    display: inline-block;
    font-weight: 400;
    height: 70px;
    margin-bottom: 6px;
    padding-top: 22px;
    text-align: center;
    width: 90px;
}

.dashboard .box .bubble-contents .title {
    font-size: 18px;
    font-weight: 600;
}

.dashboard .box .top-contents {
    margin: 10px 0px 10px 0px;
}

.dashboard .box .top-contents .rank {
    color: rgba(255, 255, 255, 0.6);
    display: inline-block;
    font-size: 56px;
    font-weight: 300;
    vertical-align: top;
    width: 44px;
}

.dashboard .box .top-contents .picture {
    background: transparent url(../images/circle_small.png) no-repeat;
    display: inline-block;
    height: 64px;
    padding: 5px 5px 5px 5px;
    vertical-align: top;
    width: 64px;
}

.dashboard .box .top-contents .picture > img {
    background-color: #f2f2f2;
    border-radius: 32px 32px 32px 32px;
    -o-border-radius: 32px 32px 32px 32px;
    -ms-border-radius: 32px 32px 32px 32px;
    -moz-border-radius: 32px 32px 32px 32px;
    -khtml-border-radius: 32px 32px 32px 32px;
    -webkit-border-radius: 32px 32px 32px 32px;
}

.dashboard .box .top-contents .details {
    display: inline-block;
    margin-left: 10px;
    padding: 4px 0px 4px 0px;
    vertical-align: top;
}

.dashboard .box .top-contents .details .name {
    font-size: 20px;
    font-weight: 600;
}

.dashboard .box .top-contents .details .value {
    color: rgba(255, 255, 255, 0.8);
    display: inline;
    font-size: 24px;
    font-weight: 600;
}

.dashboard .box .overview-contents {
    margin-top: 80px;
    text-align: center;
}

.dashboard .box .overview-contents .title {
    color: rgba(255, 255, 255, 0.9);
    font-size: 28px;
    font-weight: 300;
}

.dashboard .box .overview-contents .value {
    color: rgba(255, 255, 255, 0.9);
    font-size: 76px;
    font-weight: 300;
    line-height: 86px;
}

.dashboard .box .overview-contents .line {
    background-color: rgba(255, 255, 255, 0.4);
    height: 1px;
    line-height: 1px;
    margin: 8px auto 8px auto;
    width: 226px;
}

.dashboard .box .overview-contents .sub-value {
    color: rgba(255, 255, 255, 0.9);
    font-size: 32px;
}

.dashboard .box .progress {
    height: 343px;
    position: absolute;
    width: 384px;
}

.dashboard .box .line-chart {
    height: 279px;
    margin-left: -43px;
    position: absolute;
    width: 934px;
}

.dashboard .box ul.pending {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.dashboard .box ul.pending li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    height: 76px;
    line-height: 76px;
    margin: 0px 0px 0px 0px;
    overflow: hidden;
    padding: 0px 0px 0px 0px;
}

.dashboard .box ul.pending li:last-child {
    border-bottom: none;
}

.dashboard .box ul.pending li:hover {
    background-color: transparent;
}

.dashboard .box ul.pending li .pre {
    display: inline-block;
    font-size: 26px;
    font-weight: bold;
    height: 76px;
    line-height: 76px;
    margin: 0px 12px 0px 12px;
    overflow: hidden;
    vertical-align: top;
    width: 80px;
}

.dashboard .box ul.pending li .description {
    display: inline-block;
    font-size: 26px;
    font-weight: 300;
    height: 76px;
    line-height: 76px;
    overflow: hidden;
    vertical-align: top;
    width: 936px;
}

.dashboard .box ul.pending li .author {
    display: inline-block;
    font-size: 18px;
    height: 76px;
    line-height: 76px;
    margin: 0px 12px 0px 12px;
    overflow: hidden;
    text-align: right;
    vertical-align: top;
    width: 288px;
}

.dashboard .box ul.pending li .marker {
    background: transparent url(../images/markers_large.png) no-repeat 0px 0px;
    display: inline-block;
    height: 24px;
    margin-right: 12px;
    width: 24px;
}

.dashboard .box ul.pending li.critical .marker {
    background-position: 0px 0px;
}

.dashboard .box ul.pending li.trivial .marker {
    background-position: 0px -24px;
}

.dashboard .box ul.pending li.minor .marker {
    background-position: 0px -48px;
}

.dashboard .box ul.pending li.major .marker {
    background-position: 0px -72px;
}

.video-preview .video-target {
    margin-top: 10px;
}