.ChartPanel-1
{
    padding : 3px 3px 3px 3px;
    margin-bottom:15px;
    background-color:White;
    border-radius: 8px;
    box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
}
.ChartBox-1
{
    padding : 20px 15px 15px 15px;
}
.ChartBox-2
{
    padding : 10px 5px 0px 5px;
}
.ChartBox-3
{
    padding : 0px 5px 15px 5px;
}
.ChartBox-L
{
    padding : 20px 0px 15px 5px;
}
.ChartBox-R
{
    padding : 20px 5px 15px 0px;
}
.ChartBox-C
{
    padding : 20px 0px 15px 0px;
}
.ChartHeader-1 
{
    width:100%;
    height:30px;
    padding-top:1px;
    text-align:center;
    background-color:#7cbde7;
    color:White;
    font-size:1.5em;
    font-weight:400;
    border-radius: 5px;
}

.ChartHeader-2 
{
    width:100%;
    height:30px;
    padding-top:1px;
    text-align:center;
    background-color:#c43a41;
    color:White;
    font-size:1.5em;
    font-weight:400;
    border-radius: 5px;
}

.ChartHeader-3 
{
    width:100%;
    height:30px;
    padding-top:1px;
    text-align:center;
    background-color:#3b37ae;
    color:White;
    font-size:1.5em;
    font-weight:400;
    border-radius: 5px;
}

.ChartHeader-4 
{
    width:100%;
    height:30px;
    padding-top:1px;
    text-align:center;
    background-color:#2f6945;
    color:White;
    font-size:1.5em;
    font-weight:400;
    border-radius: 5px;
}

.ChartHeader-5 
{
    width:100%;
    height:30px;
    padding-top:1px;
    text-align:center;
    background-color:#623d8e;
    color:White;
    font-size:1.5em;
    font-weight:400;
    border-radius: 5px;
}

.summary-box {
    width:96%;
    border-radius: 4px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    margin-right:10px;
    margin-left:10px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
  
}
.summary-box-title{
    margin: 0;
    color: #FEFEFE;
    text-transform: capitalize;
    line-height: 1.2;
    font-size: 20px;
    text-align:center;
    font-weight:400;
    border-top-left-radius:4px;
    border-top-right-radius:4px;  
}
.summary-box-content{
    color: #FEFEFE;
    padding: 0 0 0 0;
    margin: 0;
    min-height:60px;
	border-bottom-left-radius:4px;
    border-bottom-right-radius:4px; 
}
.summary-box .summary-box-number 
{  
    font-size: 32px;
    font-weight:600;
    letter-spacing: 1.5px;
    text-align:right;
}
.summary-box .summary-box-number-lg 
{  
    font-size: 46px;
    font-weight:600;
    letter-spacing: 1.5px;
    text-align:right;
}
.summary-box .summary-box-text 
{
    font-size: 18px;
    text-align:left;
    padding-left:3px;
}
.summary-box .summary-box-number,.summary-box .summary-box-number-lg ,.summary-box .summary-box-text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;  
    z-index: 5;  
    line-height: 2;  
}


.summary-box .summary-box-number2 
{  
    font-size: 32px;
    font-weight:600;
    letter-spacing: 1.5px;
}
.summary-box .summary-box-text2 
{
    font-size: 20px;
}
.summary-box .summary-box-number2 ,.summary-box .summary-box-text2 {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;  
    z-index: 5;  
    line-height: 1;  
}

.summary-box .summary-box-text3
{
    font-size: 14px;
}
.summary-box .summary-box-number3 
{  
    font-size: 16px;
    font-weight:400;
}
.summary-box .summary-box-number4 
{  
    font-size: 14px;
    font-weight:400;
}


/*Background Color*/
.bg-1 .summary-box-title{        
    background: #78CFBF;
}
.bg-1 .summary-box-content{
    background: #82DACA; 
}

.bg-2 .summary-box-title{        
    background: #FBCCC2;
}
.bg-2 .summary-box-content{
    background: #F3D8D1; 
}

.bg-3 .summary-box-title{        
    background: #B5A3A1;
}
.bg-3 .summary-box-content{
    background: #C7BBBC; 
}

.bg-4 .summary-box-title{        
    background: #b4cbf9;
}
.bg-4 .summary-box-content{
    background: #CCDDFF; 
}


.bg-5 .summary-box-title{        
    background: #BE94E6;
}
.bg-5 .summary-box-content{
    background: #CCA7EC; 
}


.bg-6 .summary-box-title{        
    background: #FFF3D7;
}
.bg-6 .summary-box-content{
    background: #F8F2E0; 
}

.bg-7 .summary-box-title{        
    background: #FCEE9E;
}
.bg-7 .summary-box-content{
    background: #FCF6BD; 
}

.bg-8 .summary-box-title{        
    background: #787A79;
}
.bg-8 .summary-box-content{
    background: #A4A3A1; 
}

.bg-9 .summary-box-title{        
    background: #E6C2BF;
}
.bg-9 .summary-box-content{
    background: #EED6D3; 
}

.bg-10 .summary-box-title{        
    background: #af8eef;
}
.bg-10 .summary-box-content{
    background: #B89CED; 
}

.bg-11 .summary-box-title{        
    background: #F898A4;
}
.bg-11 .summary-box-content{
    background: #E8ABB5; 
}

.bg-12 .summary-box-title{        
    background: #BFCED6;
}
.bg-12 .summary-box-content{
    background: #DEE2EB; 
}

.bg-13 .summary-box-title{        
    background: #ada3b9;
}
.bg-13 .summary-box-content{
    background: #B7AEC3;
}

.bg-14 .summary-box-title{        
    background: #78A2CC;
}
.bg-14 .summary-box-content{
    background: #88AED0; 
}

.bg-15 .summary-box-title{        
    background: #80B7A2;
}
.bg-15 .summary-box-content{
    background: #92CEA8; 
}

.bg-16 .summary-box-title{        
    background: #9ab7f0;
}
.bg-16 .summary-box-content{
    background: #b4cbf9; 
}

.bg-17 .summary-box-title{        
    background: #dcb5b1;
}
.bg-17 .summary-box-content{
    background: #E6C2BF;
}

.bg-18 .summary-box-title{        
    background:  #b3c5ce;
}
.bg-18 .summary-box-content{
    background:  #BFCED6;
}

/*Start Color Dashboard SV*/
.bg-21 .summary-box-title{        
    background: #f07d83;
}
.bg-21 .summary-box-content{
    background: #f48a90;
}
.bg-22 .summary-box-title{        
    background: #7571e3;
}
.bg-22 .summary-box-content{
    background: #7d79e9;
}
.bg-23 .summary-box-title{        
    background: #648571;
}
.bg-23 .summary-box-content{
    background: #6f9f82;
}
.bg-24 .summary-box-title{        
    background: #786391;
}
.bg-24 .summary-box-content{
    background: #937ab3;
}
/*End Color Dashboard SV*/

.bg-51 .summary-box-title{        
    background: #ada3b9;
}
.bg-51 .summary-box-content{
    background: #B7AEC3;
}

.bg-52 .summary-box-title{        
    background: #83a1dc;
}
.bg-52 .summary-box-content{
    background: #b4cbf9; 
}

/*Font Color*/
.cl-00{color:#FEFEFE;}
.cl-01{color:Black;}
.cl-02{color:#555;}
.cl-03{color:#787a79;}
.cl-10{color:blue;}
.cl-11{color:navy;}
.cl-12{color:#0678c1;}
.cl-20{color:red;}
.cl-30{color:Green;}

/*Font Size*/
.fz-10{font-size:10px;}
.fz-14{font-size:14px;}
.fz-16{font-size:16px;}
.fz-20{font-size:20px;}
.fz-30{font-size:30px;}
.fz-40{font-size:40px;}
.fz-50{font-size:50px;}


/*width*/
.wd-18{width:18%;}
.wd-24{width:24%;}
.wd-32{width:32%;}

.fl{ float:left; }
.fr{ float:right; }

@media (max-width: 768px) 
{
    .summary-box .wd-18,.summary-box .wd-24,.summary-box .wd-32
    {
      width: 45%;  
    }
    .tot
    {
      width: 96%;  
    }  
}


/*collapse*/
.panel-collapse-heading {
    padding-left: 10px;
    border:0;
}
.panel-title>a, .panel-title>a:active{
    display:block;
    padding:15px;
    color:#555;
    font-size:16px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:1px;
    word-spacing:3px;
    text-decoration:none;
}
.panel-collapse-heading  a:before {
    font-family: 'Glyphicons Halflings';
    content: "\e114";
    float: left;
    transition: all 0.5s;
}
.panel-collapse-heading.active a:before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	transform: rotate(180deg);
}