.x-body { /*font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    font-size: 12px;
    line-height: 1.42857143;
    color: #333;
}

.x-column-header-inner {
    color: #0095e6;
    background: transparent; /*#F0F7FA;*/
}

.x-grid-header-ct {
    border: 1px solid #ddd;
    line-height: 1.42857143;
    background: transparent; /*#F0F7FA;*/
}

.x-column-header {
    border: none !important;
    background: none !important;
    text-overflow: ellipsis;
}

.x-grid-cell-inner {
   /* height: 35px;
    padding: 4px 1px 0px 4px !important;    
    padding: 14px 1px 0px 4px !important;*/ 
    padding: 5px 1px 3px 3px !important;
    font-family: 'GothamNarrow-Medium';
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

#Ext_CountryGrid .x-grid-cell-inner {
    /*height: 55px !important;*/
     height: 50px !important; 
}

.x-slider-thumb {
    z-index: 1000!important;
}

.x-grid-body {
    border: none; /*#ddd solid 1px;*/
    width: 100%!important;
}

.x-grid-td {
    /*border-right: solid 1px #ddd;*/
    border: none !important;
}

.x-column-header-align-right {
    text-align: center;
    font-weight: bold;
}

.x-column-header-align-left {
    text-align: left;
    font-weight: bold;
}

.x-column-header-align-center {
    text-align: center;
    font-weight: bold;
}

.x-grid-view {
    overflow-y: auto !important;
    position: relative;
    overflow-x: hidden !important;
}

.containerBtnSelected {
    /*background-color: #DFDFDF;*/
    border-top-style: none;
    border-left-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-bottom-width: 3px !important;
    border-bottom-color: rgb(0,142,212);
}

.containerBtnUnSelected {
    color: #999;
    font-weight: normal;
    border-top-style: none;
    border-left-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-bottom-width: 3px !important;
    border-bottom-color: rgb(216,216,216);
}

.cursorImage {
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* Opera and IE8*/
    /* -o-text-overflow: ellipsis;  
    -ms-text-overflow: ellipsis;  */
}

[hidden], template {
    display: inherit !important;
}

.selectedImg {
    background-image: url('../Images/Chart_Sel.png') !important;
    background-size: 17px !important;
}

.unSelectedImg {
    background-image: url("../Images/Chart_Unsel.png") !important;
    background-size: 17px !important;
}


/*slider styles*/
/*
.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
background-image: url(images/slider/slider-bg.png);background: url(../Images/slider_horizontal.png) center center no-repeat;width:150px;}
.x-slider-horz .x-slider-thumb {
width: 14px;
height: 15px;
margin-left: -7px;
/*background-image: url(images/slider/slider-thumb.png);
background: url(../Images/Spirit_IDB_Aug12.png) -281px -109px no-repeat;
}
*/
.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
    background: none;
}

    .x-slider-horz .x-slider-inner {
        background-color: #CACBCB;
        background-image: -webkit-linear-gradient(left, #B5B7BB 0%, #848381 50%, #615E5D 100%);
        background-image: linear-gradient(to right,#B5B7BB 0%, #848381 50%, #615E5D 100%);
        filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr=#B5B7BB 0%, EndColorStr=#848381 50%)";
        border-radius: 10px;
        /*width: 360px;*/
        height: 22px;
    }

    .x-slider-horz .x-slider-thumb {
        z-index: 102;
        border-radius: 50%;
        top: -4px;
        width: 30px;
        height: 30px;
        border: 5px solid #0096e8;
        background: #fff;
    }

.x-grid-dirty-cell {
    background-image: none !important;
}

.widthCol1 {
    /*width:12.5%;*/
}

.widthColWidget {
    border-right-style: none !important;
}

.x-grid-td:nth-child(7) {
    border-right: none !important;
}

.x-column-header-over {
    background-image: none !important;
}

/* View Indicator by country page style*/

.sliderAlign {
    padding: 0 0 0 100px;
}

.selectedIndicator {
    border-style: solid;
    border-width: 1.5px !important;
    border-color: #aab3b5;
}

.chartViewTitle {
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}

.generateBtn, .generateBtn:hover {
    background: #0094d3;
    padding: 4px 30px;
    border: 1px solid #428bca;
}

.x-btn-inner-default-small, .x-btn-inner-default-small:hover {
    color: #ffffff !important;
}

.x-btn-default-small, .x-btn-default-small:hover {
    background-image: none !important;
    background-position-x: 0px !important;
    background-position-y: 0px !important;
}

.circleImage {
    top: 0px !important;
}


#indicatorGrid .x-grid-cell-inner {
    min-height: 45px !important;
}


#viewMorebtn {
    background-color: #0095d4;
    border: none;
    padding: 5px;
    border-radius: 4px;
    color: #fff;
    margin: 10px;
    /*left:496px;*/
    width: auto;
}

#viewMorePanel {
    margin-left: 455px;
}

#viewMorebtn:hover {
    background: #0095d4;
    color: #fff;
}

#chartAnnualGrid .x-grid-cell-inner {
    height: 45px !important;
     padding: 15px 1px 3px 3px !important; 
}

#chartQuarterGrid .x-grid-cell-inner {
    height: 45px !important;
     padding: 15px 1px 3px 3px !important; 
}

#chartMonthGrid .x-grid-cell-inner {
    height: 45px !important;
     padding: 15px 1px 3px 3px !important; 
}

.x-tip {
    min-width: 58px !important;
    max-width: 400px !important;
}

.x-tip-body {
    min-width: 58px !important;
    max-width: 400px !important;
}

    .x-tip-body span {
        min-width: 58px !important;
        max-width: 400px !important;
    }

.x-column-header-sort-ASC .x-column-header-text, .x-column-header-sort-DESC .x-column-header-text {
    padding-right: 11px !important;
   

}

.x-column-header-text {
    white-space:normal !important;
    
}


/* Added New styles for Mobile view*/
.countryNameStyle {
    color: #0094d3;
    cursor: pointer;
}

.gridMaxHeight {
    max-height: auto;
}

.hideMainContant {
    display: none;
}

.showMainContainer {
    display: block;
}

.chartStyle {
    top: 100px !important;
}

.gridChartlbl {
    float: right;
    color: #0094d3;
    cursor: pointer;
    display: none;
}

@media only screen and (max-width: 350px) {

    #Ext_IndicatorGrid, #Ext_IndicatorGrid #tabAnnual{ 
 			      
 			    } 

     #Ext_IndicatorGridQuarter, #Ext_IndicatorGridQuarter #tabAnnual { 
			     
 			    } 

     #Ext_IndicatorGridMonth, #Ext_IndicatorGrid #tabAnnual {
       
    }


}

@media only screen and (max-width: 768px) {
    .gridChartlbl {
        display: block !important;
    }

     .rightcontainer .tab-content { 
 			        margin: 0 5px !important; 
 			padding: 0px 8px 0px 0px !important; 
 			    } 

    .x-grid-cell-inner {
        /*margin-left: 6px!important;
        margin-top: 27px!important;
        padding: 0px!important;
        height: 25px !important;*/
         margin-top:5px; 
    }

    #chartAnnualGrid .x-grid-cell-inner, #chartQuarterGrid .x-grid-cell-inner, #chartMonthGrid .x-grid-cell-inner,
    #chartCountryAnnualGrid .x-grid-cell-inner {
        padding: 0px !important;
    }
    .x-grid-td {
        /*border-right: solid 1px #ddd !important;*/
    }


    #viewMorePanel {
        margin-left: 0 !important;
        /*float:right;*/
    }

    #viewMorePanel-innerCt {
        width: 100% !important;
    }

    #viewMorePanel-targetEl {
        right: 0 !important;
        left: auto !important;
    }

    #viewMorebtn {
        background-color: #0095d4;
        border: none;
        padding: 5px;
        border-radius: 4px;
        color: #fff;
        margin: 10px;
        width: auto;
        position: absolute;
        top: 10px;
        right: 0px !important;
        left: auto !important;
    }


    #social_links {
        display: none;
    }

    #Ext_DD .x-grid-cell-inner {
        margin-left: 6px!important;
        margin-top: 10px!important;
        padding: 0px!important;
        height: 25px !important;
    }

    #Ext_Year_DD .x-grid-cell-inner {
        margin-left: 6px!important;
        margin-top: 10px!important;
        padding: 0px!important;
        height: 25px !important;
    }

    .selectBtn {
        background-color: #0095d4;
        border: none;
        border-radius: 4px;
        color: #fff;
        margin-top: 10px;
        height: 30px;
        cursor: pointer;
    }

    #indi_Compare_Pnl .x-panel-body-default {
        background: none !important;
    }

    .ScatterChartBG {
        background-color: #ffffff;
    }

    /* For Annual tab */

    #annual_dropdown_btn {
        display: none;
    }
    /*#chartAnnualGrid .gridMaxHeight{max-height:auto!important; }*/

   
    #Ext_IndicatorGrid .x-grid-cell {
        /* Behave  like a "row" */
        border: none;
        /*border-bottom: 1px solid #eee;*/
        position: relative;
        /*width: 20%!important; /*400px
        float: left;*/
    }


    

    #Ext_IndicatorGrid .countryNameStyle {
        color: #000000 !important;
        /*cursor:pointer;*/
    }

      #Ext_IndicatorGrid, #Ext_IndicatorGrid #tabAnnual{ 
 			        
 			    } 



    #Ext_IndicatorGrid .x-grid-cell-inner {
        text-align: center;
        /*width: 90%;*/
        color: #000000!important;
        height: 25px !important;
    }

    #Ext_IndicatorGrid .x-grid-cell:nth-of-type(1) {
        /*width: 100%!important;*/
       
 		padding:2px !important; 
        text-align: left!important;
    }

   

    #Ext_IndicatorGrid .x-grid-cell:nth-of-type(2) {
        
        padding:2px !important;
        text-align: left!important;
    }
    
    #Ext_IndicatorGrid .x-grid-cell:nth-of-type(3){
        
        padding:2px !important;
        text-align: left!important;
    }
  
      

    

    #Ext_IndicatorGrid .x-grid-cell:nth-of-type(5), #Ext_IndicatorGrid .x-grid-cell:nth-of-type(6), #Ext_IndicatorGrid .x-grid-cell:nth-of-type(7), #Ext_IndicatorGrid .x-grid-cell:nth-of-type(8) { 
        min-height: 40px;
        /*width: 90%;*/ 
 		
    }

      #Ext_IndicatorGrid .x-grid-cell:nth-of-type(9){
              min-height: 40px;
        /*width: 90%;*/
       
        }
     

        #Ext_IndicatorGrid .x-grid-cell:nth-of-type(7):before {
            content: "Trend";
            font-weight: bold;
            display: none;
        }


    /* For Quarter tab*/

    #quarter_dropdown_btn {
        display: none;
    }

    #Ext_IndicatorGridQuarter .x-grid-cell {
        /* Behave  like a "row" */
        border: none;
        /*border-bottom: 1px solid #eee;*/
        position: relative;
        /*width: 20%!important; /*400px
        float: left;*/
    }



    #Ext_IndicatorGridQuarter .countryNameStyle {
        color: #000000 !important;
        /*cursor:pointer;*/
    }
     #Ext_IndicatorGridQuarter, #Ext_IndicatorGridQuarter #tabAnnual { 
			    
 			    } 

    #Ext_IndicatorGridQuarter .x-grid-cell-inner {
        text-align: center;
        /*width: 90%;*/
        color: #000000!important;
        height: 25px !important;
    }

    #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(1) {
       
        padding:2px !important;
        text-align: left!important;
    }
   

    #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(2) {
       
        padding:2px !important;
        text-align: left!important;
    }
   
    #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(3) {
        
        padding:2px !important;
        text-align: left!important;
    }
    #Ext_IndicatorGridQuarter .x-column-header:nth-of-type(3) {
       
       
        }
        #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(4), #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(10) {
           
        }
        #Ext_IndicatorGridQuarter .x-column-header:nth-of-type(4) {
        
        
        }

    

     #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(5), #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(6), #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(7), #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(8) {
        min-height: 40px;
        /*width: 90%;*/
        
    }
         #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(9) {
              min-height: 40px;
        /*width: 90%;*/
      
        }
   

        #Ext_IndicatorGridQuarter .x-grid-cell:nth-of-type(7):before {
            content: "Trend";
            font-weight: bold;
            display: none;
        }


    /* For month tab */

    #month_dropdown_btn {
        display: none;
    }

    #Ext_IndicatorGridMonth .x-grid-header-ct {
        /*position: absolute!important;
        top: -9999px!important;
        left: -9999px!important;*/
    }

    #Ext_IndicatorGridMonth tbody {
        /*width: 100%!important;*/
    }

    #Ext_IndicatorGridMonth .x-grid-row {
        /*width: 100%!important;*/
    }

    #Ext_IndicatorGridMonth .x-grid-cell {
        /* Behave  like a "row" */
        border: none;
        /*border-bottom: 1px solid #eee;*/
        position: relative;
        /*width: 20%!important;*/ /*400px*/
        /*float: left;*/
    }


        #Ext_IndicatorGridMonth .x-grid-cell:before {
            
        }

    #Ext_IndicatorGridMonth .countryNameStyle {
        color: #000000 !important;
        /*cursor:pointer;*/
    }

    #Ext_IndicatorGridMonth, #Ext_IndicatorGrid #tabAnnual {
        /*width:760px !important;*/ 
    }

    #Ext_IndicatorGridMonth table {
        
    }

    #Ext_IndicatorGridMonth .x-grid-cell-inner {
        text-align: center;
        /*width: 90%;*/
        color: #000000!important;
        height: 25px !important;
    }

    #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(1) {
       
        padding:2px !important;
        text-align: left!important;
    }

        
        #Ext_IndicatorGridMonth .x-column-header:nth-of-type(1) {
          
        }

    #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(2) {
       
        padding:2px !important;
        text-align: left!important;
    }
    #Ext_IndicatorGridMonth .x-column-header:nth-of-type(2) {
            
        }
    #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(3) {
        
        padding:2px !important;
        text-align: left!important;
    }
    #Ext_IndicatorGridMonth .x-column-header:nth-of-type(3) {
        
       
        }
        #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(4), #Ext_IndicatorGrid .x-grid-cell:nth-of-type(10) {
          
        }
        #Ext_IndicatorGridMonth .x-column-header:nth-of-type(4) {
       
       
        }

    #Ext_IndicatorGridMonth td:nth-of-type(1) .x-grid-cell-inner {
        /*margin-top: 6px!important;
        padding:0px !important;
        font-weight: bold;*/
    }

    /*#Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(2){line-height: 40px;}*/

     #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(5), #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(6), #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(7), #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(8) {
        min-height: 40px;
        /*width: 90%;*/
       
    }
         #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(9) {
              min-height: 40px;
        /*width: 90%;*/
       
        }
     #Ext_IndicatorGridMonth .x-column-header:nth-of-type(5) {
       
        }
     #Ext_IndicatorGridMonth .x-column-header:nth-of-type(6) {
       
        }
     #Ext_IndicatorGridMonth .x-column-header:nth-of-type(7) {
       
        }
     #Ext_IndicatorGrid .x-column-header:nth-of-type(8) {
      
        }
     #Ext_IndicatorGridMonth .x-column-header:nth-of-type(9) {
       
        }
     #Ext_IndicatorGridMonth .x-column-header:nth-of-type(10) {
     
        }

      #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(7), #Ext_IndicatorGrid .x-grid-cell:nth-of-type(8) {
        /*display: none;*/
    }

        #Ext_IndicatorGridMonth .x-grid-cell:nth-of-type(7):before {
            content: "Trend";
            font-weight: bold;
            display: none;
        }

    .x-grid-header-ct {
        /*display: none !important;*/
    }



    /*View Indicator by country page styles*/

    #indicatorGrid .x-grid-header-ct {
        position: absolute!important;
        top: -9999px!important;
        left: -9999px!important;
    }

    #indicatorGrid tbody {
        width: 100%!important;
    }

    #indicatorGrid .x-grid-row {
        width: 100%!important;
    }

    #indicatorGrid .x-grid-cell {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        /*400px*/
        float: left;
    }


        #indicatorGrid .x-grid-cell:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 6px;
            left: 6px;
            
            padding-right: 10px;
            white-space: nowrap;
        }

    #indicatorGrid .countryNameStyle {
        color: #000000 !important;
        /*cursor:pointer;*/
    }

    #indicatorGrid table {
        width: 100%!important;
    }

    #indicatorGrid .x-grid-cell-inner {
        text-align: center;
       
        color: #000000!important;
        min-height: 25px !important;
    }

    #indicatorGrid .x-grid-cell:nth-of-type(1) {
        width: 100%!important;
        text-align: left!important;
    }

    #indicatorGrid td:nth-of-type(1) .x-grid-cell-inner {
        margin-top: 6px!important;
        font-weight: bold;
    }

    #indicatorGrid .x-grid-cell:nth-of-type(2), #indicatorGrid .x-grid-cell:nth-of-type(3), #indicatorGrid .x-grid-cell:nth-of-type(4), #indicatorGrid .x-grid-cell:nth-of-type(5), #indicatorGrid .x-grid-cell:nth-of-type(6) {
        min-height: 40px;
    }

    #indicatorGrid .x-grid-cell:nth-of-type(7), #indicatorGrid .x-grid-cell:nth-of-type(8) {
        display: none;
    }

    /*.x-toolbar-text-default, .x-form-text-default, .x-toolbar-separator, .x-form-text-wrap-default, .x-tbar-loading {display:none !important; }*/

}
/*Paging toolbar image override START*/
.x-tbar-page-next {
    background-image: url(../Images/BTN_next.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-tbar-page-last {
    background-image: url(../Images/BTN_last.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-tbar-page-prev {
    background-image: url(../Images/BTN_previous.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-tbar-page-first {
    background-image: url(../Images/BTN_first.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-item-disabled .x-tbar-page-prev {
    background-image: url(../Images/BTN_previous_Disable.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-item-disabled .x-tbar-page-first {
    background-image: url(../Images/BTN_first_Disable.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-item-disabled .x-tbar-page-next {
    background-image: url(../Images/BTN_next_Disable.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-item-disabled .x-tbar-page-last {
    background-image: url(../Images/BTN_last_Disable.png) !important;
    width: 22px !important;
    height: 22px;
}

.x-toolbar-default .x-toolbar-separator-horizontal {
    border-left-color: #d3d5d5 !important;
    height: 22px !important;
}

.x-toolbar-default {
    background: #f0f7fa !important;
    background-image: -webkit-linear-gradient(top,#f0f7fa,#f0f7fa);
    background-image: -ms-linear-gradient(top,#f0f7fa,#f0f7fa);
    /*background-image: -moz-linear-gradient(top,#f0f7fa,#f0f7fa);*/
    border: 1px solid #cccccc !important;
}

.x-nlg .x-toolbar-default {
    background: #f0f7fa !important;
}

#countryPagingTooldbar.x-toolbar-default {
    background-color: #f0f7fa !important;
    border-color: #ddd !important;
    padding: 10px 0 10px 10px !important;
}

#countryPagingTooldbar.x-toolbar-text-default {
    font: normal 12px Arial, Helvetica, sans-serif;
    color: #666666;
}

#countryPagingTooldbar1.x-toolbar-default {
    background-color: #f0f7fa !important;
    border-color: #ddd !important;
    padding: 10px 0 10px 10px !important;
}

#countryPagingTooldbar1.x-toolbar-text-default {
    font: normal 12px Arial, Helvetica, sans-serif;
    color: #666666;
}
/*Paging toolbar image override END*/


/*#paretoChartCountry text, #paretoChartCountry rect, #paretoChartCountry path {
    cursor:default !important;
}

#barChartIndicator text, #barChartIndicator rect, #barChartIndicator path, #barChartIndicator circle{
    cursor:default !important;
}

#lineChartIndicator text, #lineChartIndicator rect, #lineChartIndicator path, #lineChartIndicator circle{
    cursor:default !important;
}*/

.x-surface text, .x-surface rect, .x-surface path, .x-surface circle {
    cursor: default !important;
}

.x-grid-inner-locked {
    border: transparent;
}

.x-grid-cell-first {
    background-color: #0078a7;
}

.x-column-header-text {
    font: 14px GothamNarrow-Medium;
}
@media (max-width: 600px) {
	div.rightcontainer{width: auto !important;overflow: hidden;}
}