/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Dec 2, 2013, 2:57:40 AM
    Author     : And
*/

#canvas {
    padding: 0;
    margin: 0;
}

#container {
    height: auto;
    overflow: hidden;
    position: relative;
    border: 1px solid #cbcbcb;
    margin-top: 10px;
}


div.filter ul {
    padding: 0;
    margin: 0;
    text-align: right;
    margin-top:3px;

}

.filter ul li {
    list-style: none;
    display: inline-block;
    padding: 2px 0px 2px 3px;
    vertical-align: top;
}

.filter3>span,
.filter ul>.stepli span{
    font-size: 12px;
}

.filter ul li:last-child {
    padding-right: 0;
}

.filter ul li:first-child {
    border-left: none;
}

.filter ul li.stepli_noborder:last-child    {
    font-size: 12px;
}

body[dir=rtl] .filter ul li{
    padding: 2px 3px 2px 0px;
}
body[dir=rtl] .filter ul li:last-child{
    padding-left: 0;
}
body[dir=rtl] .filter ul li:first-child{
    border-right: none;
}

.filtered {
    color: #126320;
    margin-left: 5px;
    clear: both;
    display: none;
}

#container .filter img {
    /*padding: 5px 5px;*/
    cursor: pointer;
}

.filter img {
    cursor: pointer;
}
#container .ui-slider-handle {
    background-image: url("http://code.jquery.com/ui/1.9.2/themes/base/images/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6;
    background-size: 100% 100%;
    cursor: pointer;
    height: 32px;
    position: absolute;
    width: 34px;
    border: 1px solid #D3D3D3;
    color: #555555;
    font-weight: normal;
    cursor: default;
    height: 1.2em;
    position: absolute;
    width: 1.2em;
    z-index: 2;
}

.slider {
    position: relative;
}

.zoom {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAMCAMAAACdvocfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFzMzM////040VdgAAAAJ0Uk5T/wDltzBKAAAAEklEQVR42mJgYAQCBopJgAADAAbwADHy2qHzAAAAAElFTkSuQmCC");
    background-position: center bottom;
    background-repeat: repeat-x;
    background-size: 5px 40px;
    height: 18px;
    padding-top: 5px;
    margin-left: 5px;
    width: 640px;    
}

.filter {
    position: relative;
    margin-bottom: 5px;
}

.loading {
    height: 32px;
    position: absolute;
    width: 32px;
    display:inline-block;
    background-origin: 0 0;
    background-image: url("/images/front/charts/loading-blue.gif");
    background-size: 32px 32px;
}

/*addons*/
#addons {
    margin-top: 10px;
}

#addons img {
    margin-left: 5px;
}

#crosshair {
    cursor: pointer;
    border-radius: 13px;
}
.crosshair_active {
    background-color: #0087CD;
}

.canvas_crosshair {
    cursor: crosshair;
}

/*end addons*/

#timezone {
    margin-top: 8px;
}

/*notification*/

.notification {
    color: red;
    padding: 5px;
    text-align: center;
    font-size: 14px;
    margin-top: 5px;
}

/*datepicker*/
.datepicker {
    background: url("/images/calendar_icon.gif") no-repeat scroll right center #FFFFFF;
    border: 1px solid #CCCCCC;
    cursor: pointer;
    float: right;
    font-size: 12px;
    height: 20px;
    width: 100px;
}

.left_right {
    bottom: 0;
    cursor: pointer;
    float: left;
    position: absolute;
    right: 3px;
}

.start_end {
    float: right;
    margin-top: 3px;
}

.start_end label {
    float: right;
    height: 20px;
    margin-right: 10px;
    overflow: hidden;
}

.start_end span {
    display: block;
    float: left;
    margin-top: 4px;   
    cursor: pointer; 
}

.start_end input {

}

.button_orange img {
    position: absolute;
}

.charts_orange span {
    overflow: hidden;
    position: relative;
    float: right;
}


.leaders {
    clear: both;
    margin-bottom: 20px;
}


.commodities_desc img {
    width: 42px;
    height: 42px;
} 

.indices_desc {
    color: #040404;
    font-size: 10px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
}

.active_step  {
    cursor: default;
    color: #FFFFFF !important;
    background: #3f79bc;
    border-radius: 4px;
    text-decoration: none;
}

.stepli a{
    border-radius: 4px;
}

.stepli a:hover {
    color: #FFFFFF !important;
    background: #3f79bc;
}

.filter ul li a:hover {
    color: #005580;
    text-decoration: none;
}
.filter ul li a {
    text-decoration: none;
    padding: 4px 6px;
}
.category_items, .category_group {
    max-width: 100%;
    height: 36px;
    cursor: pointer;
}
.category_group{min-width: 140px;}
.category_items{min-width: 100px;}

.category_items option, .category_group option {
    cursor: pointer;
}



body[dir=rtl] .category-items-container>.category_items{
    float:right;
}
.bt_desc span {
    color: #126320;
}
.bt_desc {
    color: #131313;
    font-size: 14px;
    margin-bottom: 10px;
}

/* SPETIFICATION CSS 4 */

.prev {background-image: url("/images/front/charts/prev.png");}
.now {background-image: url("/images/front/charts/now.png");}
.next {background-image: url("/images/front/charts/next.png");}
.prev, .now, .next {display:inline-block;width:23px;height:18px;background-origin: 0 0; background-size: 23px 18px;}
.filter a {  color: #0087CD;
             font-weight: bold;
             text-indent: 0;}

.Wfll {min-width: 310px;}
#ifc_widgetcharts {width:100%;}
.filter_category_group_wg {display: inline-block;}

.filter_category_item_wg {display: inline-block;}
/*.Wcontent {overflow:hidden; width:745px;padding-left: 5px;}*/
.line.chartsw {width:90%; height:1px;margin-bottom:10px;}
.gray.chartsw {border-top: 1px solid #CCCCCC;}
#ifc_nedcharts {border: 1px solid #CCCCCC; width:100%;margin-bottom:5px;text-align: right; }
#ifc_nedcharts a {margin-right:5px;}

#canvas p {
    font-size: 25px;
    color: red;
}

.button_with_plus_a {color:black!important;float:right;margin:10px 0;vertical-align: middle; height: 28px;}
.button_with_plus {height:25px;background-color: #126320;border:1px solid #126320;padding: 0 0 0 0 !important;display:inline-block;overflow:hidden;color: #fff;}

/* END specification CSS 4 */

.button_with_plus span.orange {
    display:inline-block;
    width:26px;
    height:26px;
    background: url(/images/front/charts/market-data-sprite.png) no-repeat;
    background-position: -634px 0px;
}
.button_with_plus span.regular {float:right;line-height:25px; padding: 0 4px 0 3px;font-weight: normal;}
.button_with_plus:hover {
   background-color: #373737;
   border:1px solid #373737;
}

.button_with_plus:hover span.orange{
    background-position: -662px 0px;
} 


.filter .control {display:inline-block;}
div.filter ul {display:inline-block;float: right;}
body[dir=rtl] div.filter ul{
    text-align: left;
    direction: initial;
}

.filter_category, .filter_category_wg {
    width:100%;
    display:flex;
    justify-content: space-between;
    min-height: 40px;
}

@media (max-width: 550px){
    .filter_category{
        flex-direction: column-reverse;
    }
    .currency_selects{margin-bottom: 15px;}
    .flex_column .curr_type >div:first-child{margin-bottom: 20px;}
}
.currency_selects{
    display: flex;
}

.filter_category select,
.filter_category_wg select{
    outline: 0;
    border: solid 1px #ccc;
    padding: 0 10px;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}

.category-group-container.ifcm_select:after,
.category-items-container.ifcm_select:after{
    top: 12px;
}

body[dir=rtl] .category-group-container:before,
body[dir=rtl] .category-items-container:before{
    right: auto;
    left: 12px;
}

.filter_category_item_wg {margin-left:10px;margin-right:5px;}

#container {direction:ltr;}
#container * {direction:ltr;}
input#datepicker {text-align: left;}

.top_btn
{
    margin: 20px 0px 0px 15px !important;
}

.top_btn li
{
    display: inline-block;
    width: 33%;    
}
.top_btn li span
{

    width: 85%;    
}
ul.top_btn a span.button_green
{
    text-align: center;
    font-size: 11px !important;
}
.chart_desc
{
     overflow: hidden;
}
.chart_desc img
{    
    margin-right: 0px;
    margin-top: 10px;
}
.instrumentside
{
    overflow: hidden;
}

.instrumentside img {
    float: left;
    margin-right: 10px;
}

body[dir=rtl] .instrumentside img {
    float: right;
    margin-right: 0px;
    margin-left: 10px;
}

.chart_desc img.foreximage
{
    margin-left: -57px;
}
.amChartsPanel a {
    display: none !important; /*remove annoying amchart link, which blocks buttons*/
}

.lichart {
    top: -50%;
    left: 50%;
    margin-left: -16px;
    margin-top: -16px;
    position: relative;
}

.amChartsPeriodSelector {
    display: none;
}
#ifc_chartdiv>.filter2{
    display: block;
    position: absolute;
    height: 40px;
    left: 0;
    top: 0px;
    z-index: 1;
}
body[dir=rtl] #ifc_chartdiv>.filter2{
    text-align: left;
}

.chart_drawtype_container{
    display: inline-block;
    width: 24px;
    height: 24px;
    padding: 4px;
    background: #d8d8d8;
    border-radius: 3px;
    margin-right: 5px;
}

.chart_drawtype_container:hover{
    background: #3f79bc;
    cursor: pointer;
}

.chart_drawtype_container:hover .icon_graph_line{
    background-position: -76px -4px;
}

.chart_drawtype_container:hover .icon_graph_candlestick{
    background-position: -76px -28px;
}

.chart_drawtype_container:hover .icon_graph_ohlc{
    background-position: -76px -52px;
}



.chart_drawtype_container .chart_drawtype {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(/images/front/charts/chart-icons.png);
    margin: 0;
}
.chart_drawtype_container .icon_graph_line{
    background-position: -52px -4px;
}
.chart_drawtype_container .icon_graph_candlestick{
    background-position: -52px -28px;
}

.chart_drawtype_container .icon_graph_ohlc{
    background-position: -52px -52px;
}

#ifc_chartdiv{
    position: relative;
    display: inline-block;
}
body[dir=rtl] #ifc_chartdiv{
    direction: initial;
}
.ifc_chartdiv_wrapper {
    display: inline-block;
}
.ifc_chartdiv_wrapper .filter {
    margin-bottom: -10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ifc_chartdiv_wrapper .ui-datepicker-trigger {
    margin-left: -20px;
    float: right;
    margin-top: 3px;
}
#chart_history_update_stop {
    cursor: pointer;
    height: 20px;
    width: 20px;
}
.group_desc>.flag_32{
    float: left;
    margin-left: -60px;
}

.curr_type{
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.curr_type >div:first-child{
    margin-bottom: 40px;
    width: calc(100% - 390px);
}

@media (max-width: 992px){
    .curr_type{
        flex-direction: column;
        margin-bottom: 30px;
    }

    .curr_type >div:first-child{
        width: 100%;
    }
    
}

.click_to_open_container_wrapp{
    display: flex;
    align-items: center;
}


body[dir=rtl] .group_desc>.flag_32{
    float: right;
    margin-left: auto;
    margin-right: -60px;
}



body[dir=rtl] .top_container .block_val{
    float: left;
}
body[dir=rtl] .top_container .block_desc{
    float: right;
    border-right: none;
}
.stock_click_charts{

}
.stock_click_charts>a{
    display: block;
    font-size: 14px !important;
}
.stock_click_orange a{
    width: 100% !important;;
    margin-top: 18px;
    font-size: 28px !important;
    font-weight: bold !important;
}
.stock_click_charts>a>div{
    float: left;
}
.stock_click_charts>a>span.to_charts_sp{
    width: 15px;
    height: 19px;
    background: url(/images/front/charts/market-data-sprite.png) no-repeat;
    background-position: -818px 0;
    display: inline-block;
    margin-left: 5px;
}
.tradingconditions_ol{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: 0 !important;
}
.instrumentside p{
    text-indent: 0 !important;
}
.stock_click_right{
    position: absolute;
    font-size: 10px;
    text-decoration: underline;
    color: #0087CD;
    bottom: 2px;
    right: 20px;
}
body[dir=rtl] .stock_click_right{
    left: 28px;
    right: auto;
}
.changes{
    padding-bottom: 5px;
}
.block_desc>.bt_desc{
    margin-bottom: 0;
    margin-top: 0;
    display: inline-block;
    padding-left: 0;
    margin-left: 0px;
    width: 331px;
    text-align: center;    
}
body[dir=rtl] .block_desc>.bt_desc{
    padding-left: 0;
    padding-right: 4px;
}
.forex_advantages_buttons{
    margin-bottom: 15px;
}
span.chart_desc_top_open_close{
    font-size: 15px !important;
}

.high_low_wrap{
    margin-top: 8px !important;
}
.inst_desc_right>p{
    width: 100%;
}
.inst_desc_left>img{
    margin-top: 11px;
}
.top_container .bl2{
    margin-top: 20px !important;
}

.block_val.col-lg-3 .title_bl2_container{
    /*padding: 0 5px;*/
}
.block_val.col-lg-3 .title_bl2_container .bl2 .header{
    max-width: 92px;
}

.colored-block.red>.header{
    background: #d42b1f;
    background: rgba(0,0,0,.1);
}

.colored-block.green .header{
    background: #33aa43;
    background: rgba(0,0,0,.1);
}

.block_val.col-lg-3 .title_bl2_container .bl2 a{
    max-width: 153px;
    height: 77px;
}
.title_bl2_container .bl2 a{
    margin: 0;
    padding-left: 0px;
    padding-right: 0px;
    display: inline-block;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 0px;
}

.charts_click_stock>span{
    max-width: 220px;
}
.top_container{
    margin-top: 0 !important;
}
.block_desc>.inst_desc_left:nth-child(1){
    margin-top: 30px !important;
    min-width: 54px !important;
}
.block_desc>.inst_desc_right:nth-child(2){
    width: 240px;
    margin-top: 30px;
}
.analysis_text{
    margin-bottom: 35px;
}

/*NEW CODE*/

.chart_about_open,
.share_bt_open,
.share_button_open{
    display: none;
    margin-bottom: 30px;
}
.click_to_open>div>span,
.click_to_open .txt_with_icon,
#charts_click div{
    display: inline-block;
    color: #3d77bb;
    font-weight: 500;
    cursor: pointer;
    font-size: 14px;
}
.click_to_open>div>span:hover,
.click_to_open .txt_with_icon:hover,
#charts_click div:hover{
    color: #005580 !important;
}
.chart_about>span>span{
    float: right;
    margin-left: 5px;
    width: 23px;
    height: 21px;
    background: url(/images/front/charts/market-data-sprite.png) no-repeat;
    background-position: -119px 0;
}
.chart_about > span >:first-child{
    display: inline-block;
    margin-right: 10px;
}
body[dir=rtl] .chart_about > span >:first-child{
    margin-left: 10px;
    margin-right: 0;
}
.btn_arrow{
    border: solid #4a90e2;
    border-width: 0 2px 2px 0;
    padding: 3px;
    vertical-align: 2px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    background-color: white;
    display: inline-block;
}
.btn_arrow.active{
   border-width: 2px 0 0 2px; 
   vertical-align: -2px;
}
.click_to_open>div>span:hover > .btn_arrow{
    border: solid #005580;
    border-width: 0 2px 2px 0;
}
.click_to_open>div>span:hover > .btn_arrow.active{
   border-width: 2px 0 0 2px; 
}
.live_chart_link>span>span{
    float: right;
    width: 19px;
    height: 19px;
    margin-left: 5px;
    background: url(/images/front/charts/market-data-sprite.png) no-repeat;
    background-position: -304px 0;
}
.share_button>span>span{
    float: right;
    width: 20px;
    height: 21px;
    margin-left: 5px;
    background: url(/images/front/social_share_buttons/social_share_sprite.png) no-repeat;
    background-position: -266px 0;
}

.right_txt{
    display: inline-block;
}

.category-group-container{
    margin-right: 10px;
}
body[dir=rtl] .category-group-container{
    margin-left: 10px;
    margin-right: 0;
}
.category-group-container, 
.category-items-container{
    position: relative
}


@media (max-width: 768px) {
    .filter ul li{
        padding-left: 0 !important;
    }
    .filter ul li a{
        padding: 4px 3px;
        font-size: 10px;
    }
    .top_container .bl2{
        margin-top: 5px !important;
    }
    .block_val.col-lg-3 .title_bl2_container .bl2 a{
        height: 63px;
    }
    .click_to_open_container_wrapp .click_to_open:nth-child(2){
        display: none;
    }
    .click_to_open_container{
        margin-top: 20px;
    }
    .filter3>span, .filter ul>.stepli span{
        font-size: 10px;
    }
    .ifc_chartdiv_wrapper{
        height: auto !important;
        margin-bottom: inherit;
    }

    .category-group-container,
    .category-items-container,
    .chart_desc_top .value,
    .chart_desc_top .calculate{
        font-size: 14px;
    }
    .instrumentside{
        padding: 0 !important;
    }
    #timezone{
        display: none;
        margin-top: 0;
    }
    .filter .filter3 li.stepli:nth-child(2),
    .filter .filter3 li.stepli:nth-child(4){
        display: none;
    }
}
@media (max-width: 480px) {
    .category-group-container,
    .category-items-container,
    .category-group-container>div,
    .category-items-container>div,
    .filter_category select, .filter_category_wg select{
        width: 100% !important;
    }
    .click_to_open_container {
        padding: 0 0;
    }
    .stock_click_charts>a{
        float: right;
    }
}