﻿/*Upper column left*/

.credits {
    cursor: pointer;
}

.left-column {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-right: 14px !important;
    height: 400px
}

.right-column {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    height: 400px;
}

.h3-general {
    height: 15%;
    text-align: center;
    font-family: Lucida Grande, Lucida Sans Unicode, Arial, Helvetica, sans-serif;
    font-size: 16px;
    padding-top: 15px;
}

#img-market-value-of-bbt {
    width: 100%;
    height: 80%;
}

.background-column {
    box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);
    background: #fff;
    height: 400px;
}

/*Right colum upper*/
.right-column-upper {
    padding-top: 14px !important;
    height: 30%;
}

#h3-average-reward {
    height: 50%;
    font-weight: 600;
    text-align: left;
    font-family: Lucida Grande, Lucida Sans Unicode, Arial, Helvetica, sans-serif;
    font-size: 16px;
    padding-top: 25px;
    text-align: center;
    margin-right: 5px;
}

#h6-average-reward {
    height: 50%;
    padding-top: 5px;
    text-align: center;
    margin-right: 5px;
}

.right-column-background {
    box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);
    background: #fff;
    height: 100%;
}

#right-column-down {
    margin-left: 0px !important;
    margin-right: 0px !important;
    height: 70%;
}

.right-column-down-left {
    padding-right: 7px !important;
    height: 100%;
}

.right-column-down-right {
    padding-left: 7px !important;
    height: 100%;
}

.pie-chart {
    width: 100%;
    height: 80%;
    padding-top: 10px;
}

.h3-pie-chart {
    height: 15%;
    text-align: center;
    font-family: Lucida Grande, Lucida Sans Unicode, Arial, Helvetica, sans-serif;
    font-size: 16px;
    padding-top: 15px;
}

/*Down graphic div*/

#down-graphic-div {
    margin-top:15px;
}

.pie-chart-down {
    width: 100%;
    height: 80%;
}

/*Table div*/

#sidechains-table-div {
    margin-top: 20px;
}

.chart_container_pie {
    width: 100%;
    height: auto;
    padding: 1px;
    margin: 0 auto;
}

.chart_container_bar {
    width: 100%;
    height: 360px;
    padding: 1px;
    margin: 0 auto;
}

/*State of sidechains div*/

.nav-tabs {
    background-color: #e9ecef;
    border-bottom: none;
}

    .nav-tabs li {
        background-color: #e9ecef;
        padding-bottom: 10px;
        cursor: pointer !important;
        text-align: center;
        border: 1px solid #fff;
        /*width: 33.33%;*/
        width:100%;
    }

        .nav-tabs li a {
            color: #162e49;
            font-weight: 600;
            display: block;
            padding-top: 10px
        }

            .nav-tabs li a[class="active"] {
                border-top: 3px solid #5C88C7;
            }

@media only screen and (max-width: 768px){
    .max-with-768-right {
        padding-top: 14px !important;
    }

    .max-with-768-left {
        padding-right: 0px !important;
    }
}

#marketValueChart {
    height: 400px;
}

.margin-top-10 {
    margin-top: 10px;
}

#producerBlockValueChart{
    height: 400px;
}

.height-360px{
    height: 360px;
}

.width-100{
    width: 100%;
}

/*Tooltip*/

.showMoreTable {
    display: inline-block;
    text-overflow: ellipsis;
    opacity: 1;
    white-space: nowrap;
}

    .showMoreTable[data-title]:hover:after {
        content: attr(data-title);
        padding: 4px 8px;
        color: white;
        position: absolute;
        left: -220px;
        bottom: -4px;
        white-space: nowrap;
        border-radius: 5px;
        background: #5C88C7;
        z-index: 999;
    }


