/*Email page extra CSS styles*/

.active-button {
    color: #fff !important;
    background-color: #009ef7 !important;
}
.arrow-toggle-hor {
    transition: transform .2s ease-in-out;
    transform: rotate( -180deg);
}

/*Manage reports list*/

#manage-reports #create-custom-report .form-group span,
#manage-reports #edit-report-modal .form-group span {
    font-size: 14px;
}

#manage-reports .modal-footer div {
    max-width: 350px;
    margin: 0 auto;
    text-align: center;
}

#manage-reports .modal-footer .btn.blue {
    min-width: 140px;
}

#manage-reports .checkbox.head .btn {
    margin: -8px 0 0 0;
    min-width: 80px;
}

#manage-reports .checkbox.head {
    padding-left: 36px;
}

    #manage-reports .checkbox.head .btn:first-child {
        margin-left: 20px;
    }

    #manage-reports .checkbox.head label {
        padding: 0px;
        margin-right: 22px;
    }

#manage-reports .form-group.network {
    display: none;
}

#manage-reports .listWrap {
    cursor: pointer;
}

    #manage-reports .listWrap div {
        float: left;
        vertical-align: middle;
    }

    #manage-reports .listWrap .select-history-name {
        cursor: pointer;
    }

    #manage-reports .listWrap:hover {
        background: #ececec;
    }

.act-row, .act-row:hover {
    background: #3598DC !important;
}

#manage-reports .listWrap.act-row * {
    color: #fff !important;
}

#manage-reports .listWrap.act-row .icon-close:hover {
    color: #e7505a !important;
}

#manage-reports .listWrap.header:hover {
    background: #697882;
}

#manage-reports .listWrap div:first-child {
    width: 15px;
}

#manage-reports .listWrap div:nth-child(2) {
    width: 80%;
}

#listwrap-container .listWrap div:nth-child(2) {
    padding-left: 21px;
}

#manage-reports .listWrap.header div:nth-child(2) {
    width: 84.5%;
}

#manage-reports .listWrap div:nth-child(9) {
    float: right;
    padding-right: 15px;
}

#manage-reports .listWrap div:nth-child(3),
#manage-reports .listWrap div:nth-child(4),
#manage-reports .listWrap div:nth-child(5) {
    width: 0%;
    height: 0px;
}

#manage-reports .listWrap div:nth-child(6) {
    width: 3%;
    color: #999;
}

#manage-reports .listwrap-container .listWrap div:nth-child(6) {
    padding-left: 8px;
}

#manage-reports .listWrap div:nth-child(7),
#manage-reports .listWrap div:nth-child(8) {
    width: 3%;
}

    #manage-reports .listWrap div:nth-child(8) .icon-close {
        visibility: hidden;
    }

#manage-reports .listWrap:hover div:nth-child(8) .icon-close {
    visibility: visible;
    position: absolute;
    top: 14px;
    right: 14px;
    color: red;
}

#manage-reports .listWrap div:first-child .checkbox label::before {
    margin-left: 13px;
}

#manage-reports .listWrap div:first-child .checkbox input[type="checkbox"] {
    margin: 3px 0 0 15px;
}

#manage-reports .listWrap div:first-child .checkbox label::after {
    margin-left: 13px;
}

#manage-reports .listWrap.clear:after {
    content: "";
    display: table;
    clear: both;
}

#manage-reports .empty-list {
    text-align: center;
    padding: 15px;
    opacity: 0.7;
}

.hide-list {
    display: none;
}

#manage-reports .listWrap.header {
    display: block;
    background-color: #697882 !important;
    color: #fff;
    font-weight: bold;
    cursor: default;
    height: 45px;
    left: 0px;
}

    #manage-reports .listWrap.header:hover {
        background-color: #697882 !important;
    }

.listWrap.header * {
    border: 0px solid transparent;
}

#manage-reports .listWrap .tooltip-area,
#manage-reports .listWrap .icon-bar-chart {
    visibility: hidden;
}

#manage-reports .listWrap .tooltip-area {
    position: relative;
}




#reports-history .portlet {
    margin-bottom: 0;
}
#reports-history .panel {
    border: 0;
}
#reports-history .page-header {
    margin: 0;
}
#reports-history .page-header h3 {
    color: #195478;
    display: block;
    float: left;
    font-weight: bold;
    font-size: 23px;
}
#reports-history hr {
    margin: 10px 0 0px 0;
}
#reports-history .container {
    width: 100%!important;
}
#reports-history .panel {
    margin-bottom: 15px;
}
#reports-history .icon-printer {
    margin-right: 9px;
    font-size: 12px;
}

#reports-history .sub-txt.act {
    color: #000;
    margin-bottom: 15px;
    background-color: #fff!important;
}
#reports-history .sub-txt a {
    margin-top: 4px;
    color: #0099df;
}
#reports-history .btn-default:hover {
    color: #FFF;
    background-color: #0099DF;
    border-color: #ccc;
}

.btn-group.blue:not(.btn-outline) {
    color: #FFFFFF;
    background-color: #3598dc;
    border: 1px solid #3598dc;
    padding: 2px 20px;
}
.btn-group.blue:not(.btn-outline):hover {
    color: #FFFFFF;
    background-color: #217ebd;
    border: 1px solid #1f78b5;
}
#reports-history .btn-default {
    border-color: #c2cad8;
}
.btn-group-justified {
    width: 100%;
}
.add-contact[disabled] {
    cursor: not-allowed;
    opacity: 0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
}
#add-new-recipient-link {
    display:block;
}
#controls .btn-group-justified > .btn {
    float: left;
}
#controls .btn-default {
    border-color: #c2cad8;
    max-width: 48%!important;
    width: 48%;
    margin: 0 5px 5px 0;
}
.btn.blue:not(.btn-outline).active, .btn.blue:not(.btn-outline):active, .btn.blue:not(.btn-outline):hover, .open>.btn.blue:not(.btn-outline).dropdown-toggle {
    color: #FFF;
    background-color: #217ebd;
    border-color: transparent;
}
#select-format .btn-default:nth-child(1),
#select-format .btn-default:nth-child(2),
.report-period-div .btn-default:nth-child(1),
.report-period-div .btn-default:nth-child(2),
#selected-file-format .btn-default:nth-child(1),
#selected-file-format .btn-default:nth-child(2) {
    border-right: 0;
}
.panel-body .col-md-6.pull-left h4 {
  font-weight: bold;
}
.panel-body {
    padding: 18px 15px 15px 15px;
}
#select-building-area:hover .selected-building span, #select-building-area:hover .selected-building i  {
  color: #3598dc;
}  
.clear-both {
    content: "";
    display: table;
    clear: both;
}
/*Select building area*/


/*Ellipsis*/
#select-bulding-sub .account-tab-main .checkbox span {
    overflow: hidden;
    text-overflow: ellipsis;
    width: 228px;
    white-space: nowrap; 
    display:inline-block;
    margin: 5px 0 0 0;
    border: 0px solid red;
}
#controls .btn.btn-default {
    text-align: center;
}
#controls .btn.btn-default span {
    overflow: hidden;
    text-overflow: ellipsis;
    width: 130px;
    white-space: nowrap; 
    display:block;
    text-align: center;
    border: 0px solid red;
    margin-left: auto;
    margin-right: auto;
}

#select-building-area .checkbox label::before, #select-building-area .checkbox label::after {
    top: -4px;
}  

#select-building-area .controls-tab .checkbox {
    padding: 8px 5px 8px 22px;
    margin: 0;
    background-color: #fff;
    border: 0px solid blue;
}
#select-building-area .controls-tab .checkbox input[type="checkbox"] {
    margin: 0;
    position: relative;
}
.select-bulding-sub {
    
}
.account-tab-main .ico-collapse {
   
}



/*Period tooltip*/
#report-preview .period .tooltip-area {
    position: relative;
    display: inline-block;
    border: 0px solid red;
    left: 8px;
    top: -1px;
}

#report-preview .period .tooltip-area .tooltip-popup {
    display: none;
}

#report-preview .period .tooltip-area:hover .tooltip-popup {
    display: block;
}

/*Create custom report*/

.report-sections-block {
    position: relative;
    width: 100%;
    height: 100%;
}
.report-sections-mask,
.report-sections-mask-footer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    background-color: #fff;
    opacity: 0.6;
    z-index: 999 !important;
    margin: 0;
    border-radius: 10px;
}

.modal-footer {
    position: relative;
}

#reports.report-setting {
    border: 0!important;
    position: relative;
}
#create-custom-report .report-setting:nth-child(4) {
    border: 0px solid red;
}

#create-custom-report .report-name.form-group {
    max-width: 70%;
    margin: 0 auto 45px;
}
.report-name.form-group label {
    font-weight: bold;
}

.settings-number {
    height: 25px;
    width: 25px;
    padding: 3px 0 0 0;
    border-radius: 50%!important;
    background-color: #fff;
    border: 2px solid #3598DC;
    color: #3598DC;
    text-align: center;
    font-size: 13px;
    font-weight: bold;
    float: left;
    position: relative;
}
.report-setting-header label {
    margin: 3px 0 0 13px;
}
.ico-collapse {
    position: relative;
    float: right;
}
.report-setting-header .ico-collapse i {
    font-size: 17px;
}

#manage-reports .reports-list-header:hover {
    cursor: pointer;
}
#reports-history .report-setting .row {
    display: flex;
    flex-wrap: wrap;
    box-sizing: inherit;
    margin: 15px -15px 15px -15px;
}
#reports-history .report-setting .row .col-md-2 {
    -webkit-box-flex: 0;
    flex: 0 0 8.333333%;
    max-width: 8.3%;
    border: 0px solid red;
}
#reports-history .report-setting .row .col-md-10 {
    -webkit-box-flex: 0;
    flex: 0 0 88%;
    max-width: 88%;
    border: 0px solid blue;
    padding-left: 15px;
    padding-right: 0;
}
#reports-history .report-setting .row .col-md-2,
#reports-history .report-setting .row .col-md-10 {
    position: relative;
    width: 100%;
    min-height: 1px;
    box-sizing: inherit;
    border: 0px solid red;
    float: left;
}
.sub-icon {
    width: 22px;
    height: 22px;
    position: relative;
    /*display: inline-block;*/
    
    float: left;
    margin-right: 8px;
}

/*Sensors Settings*/


#sensors .sensors-block .row .icons {
    margin: -7px 9px 0 0;
}
#sensors .sensors-block .row .col-md-6:nth-child(1) .icons {
    width: 18px;
}
#sensors .sensors-block .row .col-md-6:nth-child(2) .icons {
    width: 22px;
}
#sensors .sensors-block .row {
    margin: 0 0 15px 0;
}

#sensors .sensors-block .row.sensor-header {
    margin: 0;
    padding: 0 0 15px 0;
    border-bottom: 1px solid #eee;
}

#sensors .sensors-block .row:last-child {
    border: 0;
}


#sensors .sensors-block .row .col-md-4 a {
    color: #000;
}
#sensors .sensors-block .row .col-md-4 .checkbox {
    margin: 13px 0;
    color: #999;
}
/*#sensors .sensors-block .row .col-md-4 .checkbox:hover {
    color: #000;
}*/


#sensors .sensors-block .sensors-container .col-md-4 .sub-icon, #sensors .sensors-block .sensors-container .col-md-4 span {
    display: none;
}

/*Capitalize first letter of sensor names with CSS*/
/*#sensors .checkbox label {
    text-transform: lowercase;
}
#sensors .checkbox label::first-letter {
    text-transform: uppercase;
}*/

/*List of sensors - for 2 or more*/

#controls .predefined-sensors-list-alert, #controls .choose-control-alert, #controls .choose-more-controls-alert {
    color: #e7505a;
    font-size: 12px;
    text-align: center;
    border: 1px solid #e7505a;
    padding: 7px;
    margin-top: 25px;
}

#controls .report-configuration-error, #controls .mult-report-configuration-error, #controls .report-configuration-exist-error {
    color: palevioletred;
    font-size: 12px;
    text-align: center;
    border: 1px solid #e7505a;
    padding: 7px;
    /*margin-top: 25px;*/
}

#controls .report-configuration-exist-error {
    margin-bottom: 14px;
}

#sensors .sensors-block.predefined-sensors-list {
    width: 95%;
    margin: 0 auto;
}
#sensors .sensors-block .row .col-md-12 a {
    color: #000;
}
#sensors .sensors-block.predefined-sensors-list .row {
    margin: 15px 0;
    border-bottom: 0px solid #eee;
}
.error-message-predefined {
    color: red;
    text-align: center;
    margin: 0px auto 20px;
    max-width: 75%;
    padding: 5px;
    font-size: 11px;
}
/*Report Settings*/

#reports .recipients {
    margin-top: 15px;
}
.preview-popup-width {
    width: 90%;
}
#report-preview-block .preview-report-title {
    font-weight: bold;
    margin-bottom: 15px;
}
#report-preview-block .preview-report-title span {
    color: #3598DC;
}
#report-preview-block .form-group.period {
    width: 280px;
}
#report-preview .form-group {
    margin-bottom: 15px;
}
/*Report Preview*/ 

#report-preview .form-group.period {
    /*width: 280px;*/
    position: relative;
    /*margin-left: 10px;*/
}

.report-diagram-preview {
    position: relative;
}
.report-diagram-preview img {
    max-width: 100%;
    height: auto;
}
#data-table {
    display: block;
    margin: 0 0 0 0;
    padding: 30px 0 0 0;
    position: relative;
}
#data-table .btn.email {
    position: absolute;
    top: 0px;
    right: 15px;
}
#data-table .btn.email i {
    margin-right: 15px;
}
/*#data-table-stats {
    margin: 30px 0 30px 0;
}*/
/*#data-table-stats .table th {
    color: #fff;
    padding: 9px 0 9px 0;
    border-right: 1px solid #fff;
}*/
/*#data-table-stats .table td {
    padding: 9px 0 9px 0;
    font-weight: normal;
}*/
/*#data-table-stats .table > thead > tr > th {
    border-bottom: 0px solid #e7ecf1;
}*/
#data-table .text-center span {
    display: none;
}
#email-data-button {
    position: relative;
}
/*#historyDataTable {
    background-color: #fff;
    position: relative;
}*/

/*Building list*/
.buildings-list-container {
    position: relative; 
    margin-bottom: 16px;
    border: 0px solid red;
}

.buildings-list-container .buildings-list-bar {
    position: relative;
    width: 100%;
    font-size: 14px;  
    font-weight: bold;
    padding: 10px 0 10px 0; 
    color: #3598dc;
    border-bottom: 1px solid #ececec;
}


.buildings-list-container .buildings-list-bar {
    margin: 0!important;
}

.building-list-multi .buildings-list-bar {
    cursor: pointer;
}

.buildings-list-container .building-row {
    padding: 14px 0;
    border-bottom: 1px solid #ececec;
}

.buildings-list-container .building-row:last-child {
    border-bottom: 0px solid #ececec;
}

.buildings-list-container .building-row i {
    margin: 0 7px 0 19px;
    font-weight: bold;
}
.buildings-list-bar.building-list-single {
    font-size: 14px;
    font-weight: bold;
    color: #3598dc;
}

/*ico arrows*/

.fa-angle-up,
.fa-angle-down {
    margin: 4px 0 0 10px;
    cursor: pointer;
    /*transform: rotateZ(-180deg);*/
}
.fa {
    font-size: 19px;
}
.arrow-toggle {
    transform: rotateZ(-180deg);
}
.arrow-toggle-hor {
    transform: rotateZ(-90deg);
}


/*Select recipient*/



#reports-history .sub-txt,
.add-new-recipient {
    margin-top: 8px;
}

.dropdown-checkbox-area .dropdown-checkbox-sub {
    border: 0;
    box-shadow: 0 0 50px 0 rgba(82,63,105,.15);
    border-radius: .475rem;
    padding: 1rem 0; 
    overflow-y: scroll;
    max-height: 150px;
}

.inactive-hover-txt {
    position: absolute;
    bottom: -27px;
    color: #A9A9A9;
    font-size: 13px;
    visibility: hidden;
}
#select-format .inactive-hover-txt {
    left: 21px;
}
#selected-file-format  .inactive-hover-txt {
    left: 10px;
}
.inactive-button:hover .inactive-hover-txt {
    visibility: visible!important;
}
.checkbox-act {
    color: #000!important;
}
/*Tooltip*/

.report-period-div {
    position: relative;
    width: 100%;
}
.tooltip-popup {
    position: absolute;
    top: 35px;
    right: 0px;
    padding: 10px 20px;
    text-align: left;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #fff;
    color: #000;
    line-height: 23px;
    background-color: #fff;
    font-size: 12px;
    font-weight: 600;
    z-index: 1000;
}
#reports .tooltip-popup {
    display: none;
}
#reports .tooltip-area:hover .tooltip-popup {
    display: block;
} 




/*Extra CSS - 3 hover texts*/
#reports .report-period-div .tooltip-area {
    position: absolute;
    top: 35px;
    left: 0px;
    border: 0px solid green;
    width: 100%;
} 
#reports .report-period-div .tooltip-area .tooltip-popup{
    position: absolute;
    border: 0px solid red;
    width: 100%;
} 
/**/

#manage-reports .listWrap div:nth-child(4) {
    position: relative;
}
#manage-reports .listWrap.header div:nth-child(3) {
    border-left: 4px solid transparent;
}
.listwrap-container .tooltip-area {
    top: 0;
    left: 11px;
}
.listwrap-container .tooltip-popup {
    width: 100px!important;
    float: none;
    padding: 5px!important;
    display: none;
}
.active-row {
    z-index: 1001!important;
}
/*Reports list*/

.reports-list-bar {
    width: 100%;
    padding: 12px 15px 10px 15px;
    background-color: #ececec;
    margin: 0;
    border-bottom: 1px solid #e3e4e5;
    cursor: pointer;
}
.reports-list-bar label {
    width: 86%!important;
    font-weight: bold;
    line-height: 19px;
    cursor: pointer;
}
/*Calendar*/

/*#select-date {
    position: relative;
    left: 13px;
    width: 300px;
    margin: 0 auto 20px;
}*/
.select-date-div,
.select-time-div {
    position: relative;
    float: left;
    width: 50%;
    margin: 0;
    padding: 0;
}
.select-datetime-row {
    position: relative;
    border: 0px solid red;
}
.select-datetime-row .select-from-to,
.select-datetime-row .select-date-col1,
.select-datetime-row .select-date-col2 {
    float: left;
}
.select-datetime-row .select-from-to {
    color: #333;
    width: 46px;
    padding: 16px 0 0 0;
}
.select-datetime-row .select-date-col1 {
    color: #227FBF;
    font-size: 35px;
    width: 45px;
    padding: 0 0 0 0;
    cursor: pointer;
}
.select-datetime-row .select-date-col2 {
    color: #999;
    font-size: 11px;
    position: relative;
    width: 31px;
    padding: 8px 0 0 0;
    cursor: pointer;
}
.select-datetime-row .icon-arrow-down-div {
    position: absolute;
    top: 13px;
    right: -9px;
}
.select-date-devider {
    float: left;
    width: 1px;
    height: 21px;
    background-color: #ccc;
    margin: 13px 29px 0 9px;
}
.select-date-sub.ampm {
    text-transform: uppercase;
}

/*JQuery calendar popup*/

.xdsoft_datetimepicker {
    z-index: 100000000;
}
.xdsoft_datetimepicker .xdsoft_datepicker {
    width: 225px;
}
.xdsoft_datetimepicker .xdsoft_timepicker {
    width: 38px;
}
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
    background-position: -48px 0;
}
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next {
    margin-left: 4px;
}
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
    width: 21px;
    margin-left: 12px;
}
.select-date-time {
    height: 0px!important;
    padding: 0;
    margin: 0;
    visibility: hidden;
}
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div {
    height: 34px;
    line-height: 13px;
    padding-top: 5px;
}

/*Custom date range*/


#select-custom-date .select-datetime-row, #select-custom-date .select-from-to, #select-custom-date .custom-date, #select-custom-date .icon-calendar-container  {
    display: inline-block;
}

#select-custom-date .select-date-time {
    width: 1px;
}

#select-custom-date .select-from-to {
    width: auto!important;
    margin: 0;
    padding: 0;
    color: #A9A9A9;
}

#select-custom-date .custom-date {
    color: #000;
}

#select-custom-date .icon-calendar-container {
    margin: 0 0 0 3px;
}

#select-custom-date .select-datetime-row {
    border: 0px solid blue;
    margin-right: 17px;
    cursor: pointer;
}

#select-custom-date .select-datetime-row:hover .icon-calendar, #select-custom-date .select-datetime-row:hover .custom-date, #select-custom-date .select-datetime-row:hover span {
    color: #3598dc;
}

#select-custom-date .sub-txt {
    margin-top: 0px;
    font-size: 12px;
}

#select-custom-date .custom-date-button {
    font-size: 10px;
    padding: 0px 7px 1px 7px !important;
    margin-top: -4px;
}

/* Extra CSS tuneup */

#report-name, #controls, #sensors {
    position: relative;
    /*width: 100%;
    height: 100%;*/
}
#sensors .checkbox-primary {
    color: #999;
}
#sensors .checkbox-primary:hover {
    color: #000;
}
#sensors .predefined-sensors-list .checkbox-primary:hover {
    color: #999;
}
#delete-custom-report .modal-dialog h5 {
    text-align: center;
}
#delete-custom-report .modal-dialog h5 span {
    font-weight: bold;
}
#report-graph-stats {
    position: relative;
}
#report-graph-stats .icon-pencil {
    margin-right: 8px;
}
.selected-building-control {
    position: relative;
    border-bottom: 1px solid #eee;
    padding: 10px 0;
}
.selected-building-control-container .selected-building-control:first-child {
    border-bottom: 1px solid #eee;
}
.selected-building-control-container .selected-building-control:nth-child(2) {
    border-bottom: 1px solid #eee;
    border-top: 0px solid #eee;
}
.selected-building-control .icon-close {
    position: absolute;
    top: 12px;
    right: 8px;
    visibility: hidden;
}
.selected-building-control:hover .icon-close {
    visibility: visible;
    cursor: pointer;
    z-index: 1000;
}
.page-header.navbar.navbar-fixed-top {
    z-index: 300000;
}
/*.modal {
    z-index: 400000;
}*/
.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover {
    background-color: transparent;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover {
    background-color: #fff;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle {
    background-color: #fff;
}
#listwrap-container .icon-ht-office {
    margin-right: 7px;
}
#select-building-area .selected-building .icon-ht-office {
    font-size: 18px;
}
#listwrap-container .icon-close {
    color: #e7505a;
}

.listWrap .stock span {
    margin-left: 10px!important;
    color: #000;
    opacity: 0.6;
    visibility: hidden;
    font-style: italic;
    font-size: 12px; 
}
.listWrap:hover .stock span {
    visibility: visible;
}
.buildings-list-bar.building-list-single i span {
    font-family: "Open Sans",sans-serif;
    color: #333;
    font-weight: normal;
    margin-left: 7px;
}
.btn.blue:not(.btn-outline).focus, .btn.blue:not(.btn-outline):focus {
    color: #FFF;
    background-color: #3598dc;
    border-color: #3598dc;
}
#btn-edit-report, #report-preview .text-right .print {
    position: relative;
}
.tutorial-show-data-area {
    position: relative;
    width: 10px;
    height: 1px;
    border: 0px solid red;
    margin: 0 auto;
}
#show-data-button, #btn-create-report {
    position: relative;
}
#historyDataTable_wrapper .table-scrollable {
    position: relative;
    background-color: #fff;
}
#manage-reports .row.reports-list-header {
  margin: 0;
}
#manage-reports .col-md-6.pull-left, #manage-reports .col-md-6.text-right {
  padding: 0;
}
#historyHeaderDataTable {
    width: 100%!important;
}
.modal-dialog {
    margin: 104px auto!important;
}
.btn-success {
    color: #FFF;
    background-color: #3598dc;
    border-color: #3598dc;
}
.btn-success:hover {
    background-color: #1577ba;
}
.noChartMessage {
    color: #a9a9a9;
    text-align: center;
    padding: 23px 0 0 0;
}


/*Legend CSS*/
.buttonStyle {
    height: 20px;
    width: 49%;
    border: 0px solid red;
    display: inline-block;
}
 
.labelStyle {
    display: table-cell;
    border-radius: 4px;
    height: 20px;
    width: 140px;
    vertical-align: middle;
    text-align: left;
    font-size: 11px!important;
    font-weight: bold;
    color: #333333;
    padding-left: 8px;
}
 
.seriesLabelStyle {
    display: table-cell;
    border-radius: 4px;
    height: 5px;
    width: 20px;
    vertical-align: middle;
}
 
.mainDiv {
    margin-left: 50px;
    max-width: 745px;
    border-top: 0px solid red;
    margin: 0 auto;
}
 
.mainDivForSplit {
    margin-left: 0px;
    width: 750px;
}
 
.splitMainDiv {
    display: table-cell;
    /*border: 1px solid #E6E6E6;*/
    border-top: 1px solid #e6e6e6;
    padding: 10px; 
    width: 50%;
}

.mainDiv .splitMainDiv:nth-child(2) {
    border-left: 1px solid #e6e6e6;
    padding: 0 0 0 20px;
}
 
.groupLabelStyle {
    display: table-cell;
    border-radius: 4px;
    height: 15px;
    width: 110px;
    vertical-align: middle;
    text-align: left;
    font-size: 13px;
    font-weight: bold;
    color: #333333;
    padding: 0px 0px 10px 0px;
}

#divCustomLegendBTL {
    padding: 10px 15px;
    width: 90%;
    float: none;
    margin: 0 auto 10px;
    text-align: center;
}

#divCustomLegendBTL .buttonStyle {
  width: 180px;
}

#divCustomLegendTL ul li {
    border: 0px solid red;
    width: 180px;
    display: inline-block;
    float: none!important;
    text-align: left;
}

#divCustomLegendTL ul li span {
    margin-right: 7px!important;
}

#divCustomLegendTL ul {
    text-align: center;
}

.exceed-message {
    margin: 0 0 10px 0;
    color: red;
}

.text-notes {
    color: #A9A9A9;
    border-top: 1px solid #e5e5e5; 
    margin: 10px 0 0 0;
    padding: 10px 0 0 0;
}

.text-notes:hover {
    color: #333;
}

.small-font {
    font-size: 8px!important;
    padding: 0!important;
}

.close {
    opacity: 0.6;
}
.close:hover {
    opacity: 0.9;
}

.bootbox.modal.fade.bootbox-alert.in {
    padding-right: 34px!important;
}

/*Chars colors*/
#divCustomLegend .seriesLabelStyle, #report-preview .highcharts-container path {
  opacity: 0.8!important;
}

/*Extra CSS - Create Report - Report Name - #1*/

/*.modal-open .modal {
    cursor: default;
}*/
.report-sections-block h4, .report-sections-block h4 label {
    cursor: pointer;
}


/*******************************************************/

/*CSS Hacks below*/

/* Safari only CSS hack */
@media screen and (-webkit-min-device-pixel-ratio:0) {

    ::i-block-chrome, #select-building-area .checkbox label::before, #select-building-area .checkbox label::after {
        top: 0px;
    }
    
    ::i-block-chrome, .tutorial-div.step-select-building .arrow {
        -webkit-transform: translateZ(31deg);
        -webkit-transform: rotate(31deg);
    }
    
    ::i-block-chrome, .arrow-toggle {
        -webkit-transform: translateZ(-180deg);
        -webkit-transform: rotate(-180deg);
    }

    ::i-block-chrome, #dateRange {
        line-height: 28px;
    }

    ::i-block-chrome, .custom-date-button {
        top: -4px;
    }

    ::i-block-chrome, #select-custom-date .sub-txt {
        margin-top: -3px;
    }

    /* Print data table on separate page - Safari only */
    @media print {
        ::i-block-chrome, .page-break  { 
            display:block; 
            page-break-before:always; 
        }
    }

}

/*Internet Explorer 11 ONLY sample*/
@media all and (-ms-high-contrast:none) {
   .foo { color: transparent } /* IE10 */
   *::-ms-backdrop, .foo { color: transparent } /* IE11 */
} 

/* Internet Explorer 11+, Microsoft Edge Browser */
@charset "";
    _:-ms-lang(x), .select-time-div { margin-top: 0px; }


/*******************************************************/

@page {
   margin: 10mm 10mm 10mm 10mm;
}

@media print {  

    body * {
        visibility: hidden;
    }
    #reports-history .existing-reports, #manage-reports  {
       display: none;
    }
    #report-graph-stats .panel, #report-graph-stats, #report-graph-stats *, #data-table, #data-table *, #data-table-stats  {
        visibility: visible;
    }
    #btn-edit-report, .btn.print, #data-table .col-md-12.text-center {
        display: none!important;
    }
    #report-preview .row .col-md-6.pull-left {
        left: -75px;
    }
    #report-preview .period-container, #report-preview .report-diagram-preview {
        left: -20px;
    } 
    .page-header {
        visibility: visible;
        display: block;
        height: 1px!important;
        position: relative;
    }
    .page-logo a .logo-default {
        visibility: visible;
        display: block;
        position: absolute;
        left: -50px;
        top: 20px;
    }
    /* Print data table on separate page */
    .page-break  { 
        display:block; 
        page-break-before:always; 
    }
    /*Minimize chart's width while printing*/
    .highcharts-root {
        width: 700px;
    }

}

@media screen and (max-width: 801px) {

    #manage-reports .listWrap div:nth-child(2) {
        width: 80%;
    }
    #manage-reports .listWrap.header div:nth-child(2) {
        width: 86%;
    }
    #manage-reports .listWrap .stock span {
        display: none;
    }

    #select-custom-date {
        /*display: block;*/
        margin: 15px 0 20px 0;
    }
    
}

@media screen and (max-width: 599px) {
    
    /*Custom Reports - Main Page*/
    #manage-reports .listWrap div:first-child {
        width: 15px;
    }
    #manage-reports .listWrap div:nth-child(2) {
        width: 60%;
    }
    #manage-reports .listWrap div:nth-child(6) {
        width: 3%;
    }
    #manage-reports .listWrap div:nth-child(7) {
        width: 8%;
    }
    #manage-reports .listWrap div:nth-child(8) .icon-close {
        display: none;
    }
    #manage-reports .listwrap-container .listWrap div:nth-child(6) {
        padding-left: 0px;
    }
    #manage-reports .listWrap.header div:nth-child(2) {
        width: 72%;
    }
    #manage-reports .listWrap.header div:nth-child(6) {
        border-left: 0px solid transparent;
    }
    .listWrap.header {
        margin: 0;
    }
    #reports-history .container {
        padding-left: 0;
        padding-right: 0;
    }
    #report-preview .col-md-12 {
        padding: 0;
    }
    #report-preview .col-md-12.text-center {
        text-align: left!important;
    }
    #report-preview .col-md-12.text-center.send-email {
        text-align: center!important;
    }
    #data-table .btn.email {
        right: 0;
    }
    #listwrap-container .listWrap div:nth-child(2) {
        padding-left: 0; 
    }
    #report-preview .row button {
        margin-bottom: 3px;
    }
    .btn, .btn-group.add-contact {
        font-size: 10px;
        text-transform: uppercase;
    }
    #manage-reports .reports-list-header h4 .fa-angle-up, #manage-reports .reports-list-header h4 .fa-angle-down {
        margin: 4px 0 0 5px;
        cursor: pointer;
    }
    #listwrap-container .reports-list-container h5 {
        font-size: 13px;
    }
    #data-table-stats {
        margin-top: 0px;
    }

    /*Create Report Popup*/
    #create-custom-report .report-name.form-group {
        max-width: 100%;
    }
   
  
  
    #report-preview-block .form-group.period,
    #report-preview .form-group.period {
        width: 93%;
    }
 
  
    #sensors .sensors-block .sensor-header {
        display: none;
    }
    #sensors .sensors-block .sensors-container .col-md-4 .sub-icon, #sensors .sensors-block .sensors-container .col-md-4 span {
        display: block;
    }
    #sensors .sensors-block .row .col-md-4 .sub-icon img {
        height: 17px;
    }
    #sensors .sensors-block .row .icons {
        margin: -5px 9px 0 0;
    }
    #controls .btn-default {
        max-width: 100%!important;
        width: 70%;
    }
    .selected-building {
        padding: 14px 4px 4px 4px;
    }
    #reports-history .page-header h3 {
        font-size: 18px;
    }
    .panel-body .col-md-6.pull-left h4 {
        font-size: 12px;
    }
    #reports .report-period-div .tooltip-area {
        top: 25px;
    }

    /*Custom period*/
    #dateRange {
        width: 215px;
    }
    .select-date-from, .select-date-to {
        margin-bottom: 7px;
    }
    #select-custom-date .sub-txt {
        display: none;
    }
    
    /*Calendar*/
    #select-date {
        left: -5px;
    }
    .select-date-div, .select-time-div {
        width: 50%;
    }
    .report-period-div .tooltip-area {
        right: -17px;
    }
    .listwrap-container .tooltip-area {
        right: -3px;
    }
    .report-name.form-group label {
        font-size: 11px;
    }
    .panel-body .col-md-6.pull-left h4 {
        margin-top: 2px;
    }
    #select-building-area .selected-building span {
        font-size: 12px;
    }
    .tooltip-area {
        right: -254px;
    }
    .report-period-div .tooltip-area {
        top: 4px;
    }
    .add-new-recipient.email-report button {
        font-size: 10px;
    }
   

    /*Legend*/
    .buttonStyle {
        width: 100%;
    }
    #data-table-stats {
        overflow-x:auto;
    }
    .buildings-list-bar.building-list-single {
        font-size: 12px;
    }
    
}