#rm-tv-backdrop{
    position: relative;
    height: 100%;
    background-color: rgb(61, 61, 61);
}

#rm-tv-backdrop-loading{
    position: absolute;
    top: 50%;
    left: 50%;
    /*ie 9*/
    -ms-transform: translate(-50%, -50%);
    /*safari*/
    -webkit-transform: translate(-50%, -50%);
    /*others*/
    transform: translate(-50%, -50%);
}

#rm-tv-backdrop-loading > img{
    height: 80px;
}

/*spin animation keyframes defined in sw_styles.css*/
#rm-tv-backdrop-loading >img:nth-child(1){
    -webkit-animation:spin 4s linear infinite !important;
    -moz-animation:spin 4s linear infinite !important;
    -o-animation: spin 4s linear infinite !important;
    animation:spin 4s linear infinite !important;
}

/*texto de falha de ligaçao ao servidor*/
#rm-tv-no-server-connection{
    position: absolute;
    top: calc(50% + 85px);
    left: 50%;
    /*ie 9*/
    -ms-transform: translate(-50%, -50%);
    /*safari*/
    -webkit-transform: translate(-50%, -50%);
    /*others*/
    transform: translate(-50%, -50%);
    color: white;
    font-size: 30px;
    width: 90%;
    text-align: center;   
}

.rm-tv-navbar{
    background-color: rgb(99, 115, 120) !important;
    height: 70px;
}

#rm-tv-top-menu  .navbar-right{
    padding-right: 5px;
}

#rm-tv-top-menu .navbar-right li{
    line-height: 70px;
}

#rm-tv-top-menu .navbar-right a{
    color: white !important;
    padding: 24px;
    font-size: 25px;
}

#rm-tv-top-menu ul li:hover a{
    background-color: #383838;
    cursor: pointer;
}

#rm-logo-container{
    background-color: transparent;
    color: white;
    margin: 10px;
}

#rm-logo-container:hover{
    background-color: transparent !important;
    cursor: inherit !important;
}

.sw-renewables-monitor-white{
    line-height: 25px;
    font-size: 30px;
}

.sw-renewables-yellow{
    line-height: 25px;
    font-size: 18px;
    color:rgb(251,185,0);
    text-align: right;
}


/*live tv page content*/
#rm-tv-content{
    height: 100%;
    padding-top: 70px;
}

#rm-tv-content .row, #rm-tv-content .col-md-12{
    /*height: 100%;*/
}

/*rows do conteudo da pagina*/
#rm-tv-installation-weather-row{
    padding-top: 20px;
}

#rm-tv-daily-indicators-row{

}

#rm-tv-chart-and-indicators-row{
    height: 70%;
}

#rm-tv-chart-and-indicators-row .rm-indicator-title{
    text-align: center;
}

#rm-tv-period-row{

}

#rm-tv-chart{
    height: 65vh;
}

#rm-tv-installation-name{
    font-size: 5vh;
    font-family: GothamBold;
}

.installation-daily-income > div{
    display: inline-block;
}

.rm-tv-daily-income{
    font-size: 5vh;
}

.rm-tv-previous-income{
    font-size: 2.5vh;
}

.rm-tv-date-container{
    font-size: 2.5vh;
}

.rm-tv-daily-icon{
    font-size: 4vh;
}

#rm-tv-chart-area{
    display: inline-block;
    /*background-color: red;*/
    height: 100%;
    width:80%;
    float: left;
}

#rm-tv-indicators-area{
    display: inline-block;
    /*background-color: blue;*/
    height: 100%;
    width: 20%;
    float: right;
}

/*subscricao de espacamento dos indicadores*/
#rm-tv-indicators-area .rm-indicator{
    margin-bottom:15px;
}

#rm-tv-indicators-area .rm-indicator .rm-indicator-content{
    height: calc(16.25vh - 40.5px)!important;
    /*margin is 10px on all sides*/
    line-height: calc(16.25vh - 60.5px)!important;
}

#rm-tv-indicators-area .rm-indicator .rm-indicator-icon{
    /*margin is 10px on all sides*/
    line-height: calc(16.25vh - 60.5px)!important;
}

#rm-tv-indicators-area .rm-indicator-main-info{
    font-size: 2.0vw;
}

#rm-tv-indicators-area .rm-indicator-secondary-info{
    font-size: 1.1vw;
}

#rm-tv-indicators-area .production-days-indicator .rm-indicator-content div{
    text-align: right !important;
}

.period-indicator{
    display: inline-block;
    padding: 10px;
    text-align: center;
    padding-left: 3vw;
}

.visible-period-icon{
    border-left: 40px solid transparent;
    border-right: 40px solid transparent;
    border-bottom: 10px solid #ff8503;
    border-top: 0px;
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: bottom;
    min-height: 10px;
    opacity: 1;
    -webkit-transition: opacity 1s;
    -moz-transition: opacity 1s;
    -ms-transition: opacity 1s;
    -o-transition: opacity 1s;
    transition: opacity 1s;
}

.visible-period-icon:hover{
    opacity:0;
}

.visible-period-icon.visible{
    opacity:1;
}

.visible-period-icon.hidden{
    opacity:0;
}

.period-text{
    font-family: GothamBold;
    font-size: 2.8vh;
}