/*spinner*/
.whiteout{
    position:fixed;
    height:100%;
    width:100%;
    z-index:99999;
    background-color:#FFF;
    opacity:0.5;
    text-align:center;
    vertical-align:middle;
    padding:20%;
    top:0;
    left:0;
    color:#535354;
}
.blackout{
    position:fixed;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:0.4;
    z-index:9999999;
    top:0;
    left:0;
    right:0;
    bottom:0;
    text-align:center;
    vertical-align:middle;
    padding-top:20%;
    display:none;
}

.buffer-left{padding-left:5px;}
.buffer-right{padding-right:5px;}
.buffer-top{padding-top:5px;}

.navbar-form{width:50%;}
.navbar-form .form-group{
    display:block;
    position: relative;
}
.navbar-form .form-control{width:100%;}

ul.typeahead{
    max-height:400px;
    overflow-y:auto;
    left: 0px;
    right: 0px;
}

.detail-group ul{
    list-style:none;
    padding-left: 15px;
}
.detail-group label{margin-bottom:0;padding-right:15px;min-width:100px;display:table-cell;text-align:right;}
.detail-group span{display:table-cell;}
.detail-group li.primary{font-size:120%;}

.stock-group {list-style:none;}
.stock-group li{padding:5px 0;}
.stock-group label{min-width:60%;display:inline-block;}
.stock-group span{min-width:none;display:inline;}
.stock-group li.primary span{font-size:100%;}

#flotchart{height:240px;}
#overview{height:60px;}
#pie{height:340px;}

#pie .pieLabel div{color:white!important;}

#date{
    cursor:zoom-in;
    width:auto!important;        
    display:inline-block;    
}
#date span{            
    color:#09c;
}
#date:hover{
    border-color:#ccc;
    background-color:#f8f8f8;
}
#body{display:none;}
#zoomdate{display:none;}
#forecast{display:none;}

#controls{padding:10px 0;}
#controls [period]{font-weight:900;}

#empty-col{height:400px;}


.legendBar{
    border: 2px solid #fff;
    border-radius: 3px;
    box-shadow: 0 0 1px #777;
    height: 20px;
    width:20px;
    float:right;
}
#summary-col .table td span {font-size:110%;}


.scopetip{            
    position: absolute;
    display: none;
    border: 1px solid #fdd;
    border-radius: 6px;
    padding: 7px;
    text-align: right;
    background-color: #fee;
    opacity: 0.90;
}

.scopetip h3,.scopetip h4,.scopetip h5{
    margin:0;         
}

#supplierItem{
    position:fixed;
    right:0;
    left:0;
    bottom:0;        
    z-index:10;
    background-color:#FFF;
    height:100%;    
    overflow:auto;
    padding:10px 20px;
}
#supplierItem a{font-weight: bold;}

#supplierItem table tr td{vertical-align: top;padding:2px 6px;}

.ctnLocation{

}

.ctnLocation div:first-child{
    font-size: 120%;
}

.ctnLocation div{
    padding: 5px;
}

.styleLegendPie{
    margin-right: 10px;
    margin-bottom: 10px;
}

.btnToggleMenu {
  display: block !important;
}

@media (max-width: 1500px){
    .panel-default, .panel-info{
        min-width: 170px;
    }
    .section-details{
        padding: 5px !important;
    }
    .section-details ul{
        padding: 0px;
        margin: 0px;
    }
    .section-details label, .section-details span{
        padding: 0px !important;
        margin: 0px !important;
        text-align: center;
        display: block !important;
        /* min-width: 150px; */
    }
    .section-details span{
        margin-bottom: 5px !important;
    }
}

.forecastMoveBtn{
    margin: 10px 5px;
}

.sectionChangeForecastItem{
    padding: 0px 10px;
}

.navbar-default{
    position: fixed;
    top: 0px;
    width: 100%;
    left: 0px;
    right: 0px;
    z-index: 9;
}

#body{
    margin-top: 65px;
}

#tblForcastPage th{
    padding: 2px 10px;
}

.focusFont{
    font-weight: bold;
    font-size: 16px;
}