#topMainColumn { font-family: almoniDL400, "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif; font-size: 0.8em; line-height: 1.2em }



@font-face{
	font-family:'BebasNeueRegular';
	font-weight:700; /*(bold)*/
	font-style: normal;
		src: url('../../../Static/fonts/bebas-neue/BebasNeueRegular.eot') format('embedded-opentype'), 
		url('../../../Static/fonts/bebas-neue/BebasNeueRegular.ttf') format('truetype');
}
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 400;
  src: url(../../../Static/fonts/OpenSans/OpenSans-Regular.ttf) format('truetype');
}

@font-face {
  font-family: 'OpenSansHebrew';
  font-style: normal;
  font-weight: 400;
  src: url(../../../Static/fonts/OpenSansHebrew/OpenSansHebrew-Regular.ttf) format('truetype');
}

@font-face {
  font-family: 'OpenSansHebrewCondensedBold';
  font-style: normal;
  font-weight: 800;
  src: url(../../../Static/fonts/OpenSansHebrewCondensed/OpenSansHebrewCondensed-Bold.ttf) format('truetype');
}

@font-face {
  font-family: 'OpenSansHebrewCondensedRegular';
  font-style: normal;
  font-weight: 800;
  src: url(../../../Static/fonts/OpenSansHebrewCondensed/OpenSansHebrewCondensed-Regular.ttf) format('truetype');
}

@font-face {
  font-family: 'OpenSansHebrewCondensedLight';
  font-style: normal;
  font-weight: 800;
  src: url(../../../Static/fonts/OpenSansHebrewCondensed/OpenSansHebrewCondensed-Light.ttf) format('truetype');
}

@font-face {
font-family: 'almoniTzar7';
font-weight: 700; /*(bold)*/
font-style: normal;
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-700.eot');
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-700.eot') format('embedded-opentype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-700.ttf') format('truetype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-700.woff') format('woff');
}
@font-face {
font-family: 'almoniTzar3';
font-weight: 300; /*(light)*/
font-style: normal;
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-300.eot');
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-300.eot') format('embedded-opentype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-300.ttf') format('truetype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-300.woff') format('woff');
}
@font-face {
font-family: 'almoniTzar4';
font-weight: 400; /*(regular)*/
font-style: normal;
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-400.eot');
src: url('../../../Static/fonts/almoni/almoni-tzar-aaa-400.eot') format('embedded-opentype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-400.ttf') format('truetype'), url('../../../Static/fonts/almoni/almoni-tzar-aaa-400.woff') format('woff');
}

 

@font-face {
    font-family: 'almoniDL400';
    font-weight: 400; /*(regular)*/
    font-style: normal;
    src: url('../../../Static/fonts/almoni2019/almoni-neue-regular-aaa.eot');
    src: url('../../../Static/fonts/almoni2019/almoni-neue-regular-aaa.eot') format('embedded-opentype'), url('../../../Static/fonts/almoni2019/almoni-neue-regular-aaa.woff2') format('woff2'), url('../../../Static/fonts/almoni2019/almoni-neue-regular-aaa.woff') format('woff');
}

@font-face {
    font-family: 'almoniDL700';
    font-weight: 700; /*(bold)*/
    font-style: normal;
    src: url('../../../Static/fonts/almoni2019/almoni-neue-bold-aaa.eot');
    src: url('../../../Static/fonts/almoni2019/almoni-neue-bold-aaa.eot') format('embedded-opentype'), url('../../../Static/fonts/almoni2019/almoni-neue-bold-aaa.woff2') format('woff2'), url('../../../Static/fonts/almoni2019/almoni-neue-bold-aaa.woff') format('woff');
} 



#templateIndicator, #templatePeriod, #templateColor { display: none}

/* ------highstock class----- */
/*.highcharts-label highcharts-tooltip   highcharts-tooltip-box*/
.highcharts-tooltip-box{ font-size:15px;}


.highcharts-xaxis-labels > span {
  word-break: all!important;
  white-space: normal!important;
}
/*----------*/
.narrow{
    width: 126px;    
    text-align: center;
    padding: 5px;
    display: inline-block;
    vertical-align: top;
    float: left;
   
}
.outerContainer{
    width: 85%;
    text-align:center;
    display: inline-block;
    float: left;
    
}


#topMainColumn.graph{
    width: 100%;

}

.graphFrame {  min-height: 50% }

.darkTheme{
    background-color: #2b908f;
    background-color: #90ee7e;
    background-color: #f45b5b;
    background-color: #7798BF;
    background-color: #aaeeee ;
    background-color: #ff0066;
    background-color: #eeaaee;
    background-color: #55BF3B;
    background-color: #DF5353;
    background-color: #7798BF;
    background-color: #aaeeee;}

/*download image/execl*/
section.downloadDialog {
    min-height: 320px;
}
section.maxSymbolsAlert{
    min-height: 250px;
}
section.msgBox{
    display:none;
    position:absolute;
    left:50%;top:50%; 
    transform:translate(-50%,-50%);
    z-index:21;
    width:449px ; 
    height:auto;     
    margin:0; 
    padding:0; 
    direction: rtl;
    box-shadow: 0 0 12px 0 rgba(124, 142, 164, 0.48);
    background-color: #fff;
    font-family: almoniDL400;
    outline: 10000px rgba(255, 255, 255, 0.63) solid
}
section.msgBox h2{ 
    background-color: #97133f;
    font-family: almoniDL700;
    font-size: 20px;    
    color: #ffffff;
    font-weight: 900;
    text-align: center;
    vertical-align: middle;
    padding-top: 16px;
    padding-bottom: 16px;
    position: relative;  
    margin: 0;
}
section.msgBox h2 span{
    width: 20px; height:20px;         
    background: url(../../../images/portal/graphs/icn-x.svg) no-repeat 0 0;
    position: absolute;
    top: 13px;
    left: 20px;    
}
section.msgBox ul{
    text-align: center;    
    margin: 25px 1px 20px 0px;
    position: relative;
    width: 100%;
    padding: 0;
}

section.msgBox ul li{
    height:100px;
    width: 182px;    
    background-color: #fff;    
    text-align: center;
    font-family: almoniDL700;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    color: #072f5a;  
    padding-top: 22px;
    border: solid 1px #f0f0f0;
    position: relative;
    margin: 10px;
    display: inline-block;
    cursor: pointer;
}
section.msgBox ul li.selected{  
  background-color: #eef5fa;
  border: solid 1.5px #6fb8da;
  
}


section.msgBox ul li span{
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 61px;
    left: 73px;
    
}

section.msgBox ul li.img span {
    background: url(../../../images/portal/graphs/icn-picture-light.svg) no-repeat 0 0;    
}
section.msgBox ul li.excel span {
    background: url(../../../images/portal/graphs/icn-excel-light.svg) no-repeat 0 0;    
}
section.msgBox div{
    position: relative;
    text-align: center;     
    width: 100%;
    border-top: solid 0.8px #f0f0f0; 
    padding-top: 20px;
    padding-bottom: 20px;
}
section.msgBox div span.button{
  width: 140px;  
  background-color: #fff;
  color:#97133f;
  text-align: center;
  vertical-align: middle;
  display:inline-block;
  border: solid 1px #97133f;
  border-radius: 0;
  margin: 5px;
  padding: 10px;
  font-family: almoniDL400;
  font-size: 17px;
  font-weight: normal;
  cursor: pointer;

}

section.msgBox div span.button.selected{  
  background-color: #97133f;
  color:#fff
}

section.msgBox div.content{
    height: 21.3px;
    font-family: almoniDL700;
    font-size: 18px;
    font-weight: bold;
    line-height: 22px;
    padding: 46px 0 46px 0 !important;
    color: #072f5a;
}


/*   indicators form  */
section.indicatorForm{
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 20;
    width: 448px;
    min-height:170px;
    height: auto;
    padding: 0;
    margin:0;
    background-color: #ffffff;
    box-shadow: 0 0 12px 0 rgba(124, 142, 164, 0.48);
    font-family: almoniDL400;
    outline: 20000px rgba(0,0,0,0.5) solid;
}
section.indicatorForm h2{
    background-color: #97133f;
    padding: 11px 20px;
    font-family: almoniDL400;
    font-size: 20px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.4px;
    text-align: center;
    color: #ffffff;
    margin:0;
    direction: ltr;
}
section.indicatorForm h2 span  {
    width: 14px; height:20px; color: #fff; float: left;padding-right:20px; background: url(../../../images/portal/graphs/icn-x.svg) no-repeat 0 0; cursor:pointer;
}

section.indicatorForm .indicatorFormContent {
 
  font-family: almoniDL400;
  font-size: 15px!important;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.33;
  letter-spacing: 0.4px;
  text-align: center;
  color: #072f5a;
  
}
section.indicatorForm .indicatorFormContent h3{
    font-size: 15px!important;
    background-color: #f6fafd;
    padding: 21px 30px;
    margin: 0;
    
}
 section.indicatorForm .indicatorFormContent ul{
     width: 40%;  
     float: right;
     direction: rtl;
     text-align:right;
 }
 section.indicatorForm .indicatorFormContent ul li{
     height: 26px;
     display:block;

 }
    section.indicatorForm .indicatorFormContent ul.fields {
        border-left: 2px solid  #e0ecf5;
        padding-left: 5px;
        padding-right: 5px;
        margin-left: 5px;
    }
 section.indicatorForm .indicatorFormContent ul.fields li label{
     width: 83px;
     line-height: 24px;
     vertical-align: top;
 }
 .linesColors li label {     line-height: 24px;
     vertical-align: top;}
  section.indicatorForm .indicatorFormContent ul.fields li div.calc{
      display: inline-block;
      height: 22px;
      float: left;
  }
 section.indicatorForm .indicatorFormContent ul.fields li div.calc span{
     width: 24px;
     height: 22px;
     background-color: #e0ecf5;
    /*color: white;*/
    float: right;
    text-align:center;
	cursor: pointer;
 }
 
 section.indicatorForm .indicatorFormContent ul.fields li div.calc input.num{
    background-color: white;
    color: #1a2855;
    width: 22px;
    float: right;    
    border: none;
    text-align: center;
 }
 section.indicatorForm .indicatorFormContent ul li input.squere{
     width: 17px;
     height: 17px;
     border: solid 1px #dadfe1;
     display: inline-block;
     margin: 0;
     padding: 0;
	 cursor: pointer;
 }


 section.indicatorForm .sep{
     clear: both;
     width: 100%;
     margin : 10px 0px;
     border-top: 1px solid #e0ecf5;
     text-align: center;
     direction: rtl;
     padding-top: 10px;


 }
 section.indicatorForm .sep input{
     width: 141px;
     height: 32px;
     text-align:center;
     color: #97133f;
     background-color: white;
     font-family: almoniDL400;
     font-size: 15px;
     letter-spacing: 0.3px;
     border: solid 1px #97133f;
	 cursor: pointer;
 }
    section.indicatorForm .sep input:hover {
        color: white;
        background-color :#97133f;
    }

    
    .c1{background-color: #59cacf; }
    .c2{background-color: #8c71cc; }
    .c3{background-color: #ed4363; }
    .c4{background-color: #ff5d5d; }      
    .c5{background-color: #97133f; }

    .tooltip { text-align:right;direction:rtl; }
    .tooltip span.tooltipTitle {  text-align:right;direction:rtl;width:66px;display:inline-block; }
    .tooltip span.tooltipNum { display:inline-block;direction:ltr ; }

    

/*    ===== end indicators ============*/

#annotation-form{       
   
    z-index : 2;
    display: none;
    background-color: white;
}

fieldset {
  margin-bottom: 10px;
  font-size: 12px;
}

fieldset input[type="text"] {
  width: 130px;
}

ul {
  list-style-type: none;
}


 .graphFrame {
     padding: 26px 13px 13px 10px;     
     /*background-color:#f3f8fc;*/
     overflow: hidden;
 }
 
 
 .tools {
     padding: 0px 9.5px;
     float: left;
     visibility: hidden;
 }

 .tools span {width: 35.9px;

      height: 35.9px;
      object-fit: contain;
      display: block;
      cursor:pointer;
 }

 

 section.topMenu{
     margin-bottom: 10px;
     margin-left: 54px;
     direction: rtl;
     
 }
 section.topMenu .resolutionGroup{
     float: left;
     width: 400px;
 }
 section.topMenu .indicatorsAndCompare{
     float: right;
     position: relative;
     margin-right: 25px;
 }


section.topMenu .graphType { float: left; overflow:hidden;   width: 60px;}
section.topMenu .graphType span {width:26px; height:25px; float:left; cursor: pointer;}
section.topMenu .graphType .lineGraph {background:url(../../../images/portal/graphs/tub-candle.svg) no-repeat 0 0;}
section.topMenu .graphType .candleGraph {background:url(../../../images/portal/graphs/tub-liniar.svg) no-repeat -25px 0;}  

section.topMenu .graphType .lineGraph.active {background:url(../../../images/portal/graphs/tub-liniar.svg) no-repeat 0 0;}
section.topMenu .graphType .candleGraph.active {background:url(../../../images/portal/graphs/tub-candle.svg) no-repeat -25px 0;}  

 .tab{
     display: inline-block;
     width: 77px;     
     height:40px;
 
     text-align: center;
     vertical-align:middle;
      line-height: 40px;
 }
    .tab.compare span, .tab.indicators span {
        font-family: almoniDL400;
        font-size: 18px;
        font-weight: bold;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: 0.4px;
        text-align: right;
        color: #072f5a;
    }
    .tab.compare.selected, .tab.indicators.selected {
        background-color: white;
        text-align: center;
        vertical-align: middle;
    }
        .tab.compare.selected > span, .tab.indicators.selected > span {
            font-family: almoniDL400;
            font-size: 18px;
            font-weight: bold;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: 0.4px;
            text-align: right;
            color: #0076b7;
        }
 /* instrument compare */
 .compare{
     position: relative;
 }
 .indicators{
      position: relative;
  }  
 #divGraphSearchBox {
     position: absolute;
     margin-top: 0!important;
     left: -256px;
     width: 330px;
     height: auto;
     display: none;
     z-index: 20;
     border: 1px solid #dadfe1;
     background-color: white;
     max-height: 370px;
     box-shadow: none;
 }

 #query_for_graph{
    width: 95%;
    border: none;   
    line-height: 18px;    
    border-bottom: 1px solid #dadfe1;
    text-align: right;
    background: url(../../../images/portal/graphs/search.svg) center left no-repeat;
    direction: rtl;
    padding: 6px 8px;
 }

#divGraphHiddenSearch {
    
    max-height: 300px;
    overflow-y: scroll;
    top:40px;
    padding:0 !important
}


#divGraphHiddenSearch table {
    width: 100%;
    direction: rtl;
    padding: 0;
    margin: 0;
    display: block;
    padding: 10px !important
}
 #divGraphHiddenSearch table tr{
     background-color: #fff;
     height: 22px;
 
 }
 

    #divGraphHiddenSearch tr:hover td {background-color: #fbf5f1cf;}
    #divGraphHiddenSearch tr:hover td.title2 {background: none;}
    #divGraphHiddenSearch tr:hover td.title2 span { color: #1a1a1a;}
    #divGraphHiddenSearch tr td {
        padding: 6px 20px 4px;
        font-size: 16px;
        line-height: 1;
        color: #1a1a1a;
        font-family: AlmoniDL400;
        white-space: nowrap;
    }
        #divGraphHiddenSearch tr td.title1 {
            font-size: 12px !important;
            color: #1a1a1a;
            padding: 10px 10px 5px 10px;
            background: #fff;
            font-family: AlmoniDL400 !important;
            text-align:center
        }

 

            #divGraphHiddenSearch tr td.instrumentName {
                font-size: 16px !important;
                color: #1a1a1a !important;
                line-height: 15px;
                font-family: 'almoniDL700';
            }

#tblHiddenSearch tr td.title2 span {cursor:auto; background:none}
#divGraphHiddenSearch table tr.selected {
    cursor: auto
}

 #divGraphHiddenSearch table tr td:nth-child(1){
     text-align: right;
     direction: ltr;
 }
  #divGraphHiddenSearch table tr td:nth-child(0){
     text-align: left;
 }
#divGraphHiddenSearch table tr td {
    font-family: AlmoniDL400;
    font-size: 15px !important;
    opacity: 0.63;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.3px;
    text-align: right;

}
    #divGraphHiddenSearch table tr td , #divGraphHiddenSearch table tr td{
        
        opacity: 1;
    }

 #divGraphHiddenSearch table tr td:nth-child(1){
     text-align: right;
 }


#divGraphHiddenSearch table tr td a {
    float: none !important
}

    #selIndicatorWraper {
        display: none;
        position: absolute;
        top: 40px;
        z-index: 20;
        right: 10px;
        width: 100px;
        height: auto;
        border: 1px solid #dadfe1;
        background: white;
    }


 #selIndicatorWraper ul{
     width: 100%;
     padding: 0;
 }

 #selIndicatorWraper ul li{
     color: #052953;
     font-weight: normal;
     background-color: #fff; 
     line-height: 20px;
 }
 #selIndicatorWraper ul li:hover{
     color: #46607f;
     font-weight: bold;
     background-color: #f3f8fc; 
     cursor: pointer;
 }
 #selIndicatorWraper ul li.selected {
    color: #46607f;
    font-weight: bold;
    background-color: #f3f8fc; 
}
 
 .rectangle {
      /*width: 67px;
      height: 25px;*/
      border: 1px solid #97133f;
      border-left: 0;
      /*display: inline;*/
      float: inherit;
      margin: 0;
      padding:5px 4px;
      cursor: pointer;
}
 .rectangle.last{
     border-left: 1px solid #97133f !important;
 }
 .rectangle.selected {
     background-color: #97133f;
     color: white;
 }
 .rectangle.selected span {color:#fff}

 .rectangle span, #mainColumn label {
      width: 54.2px;
      height: 14px;
      font-family: almoniDL400;
      font-size: 12px;
      font-weight: normal;
      font-style: normal;
      font-stretch: normal;
      line-height: normal;
      letter-spacing: 0.3px;
      text-align: center;
      color: #97133f;
      display: inline-block;
      margin: 0;
      padding:0;
      direction: rtl;
}

 .rectangle.selected span {     
     color: white;
 }

 .rectangle.notactive {
     border: 1px solid #cdcdcd;
     cursor: auto;
 }
 .rectangle.notactive span {
     color: #cdcdcd;
 }

 .rangeSelectorLine {
     display: block;
      direction: rtl;     
      margin: 10px 0;
 }
 .rangeSelectorLine .customRangeSelectorButtons{
    width: 65%;
    float: right;    
   
 }
 .rangeSelectorLine .customRangeSelectorInputs{    
     float: left;
    
 }
 .rangeSelectorLine input{
     width: 100px!important;
     cursor: pointer;
     
 }
 .rangeSelectorLine label:after {content: '^';
    font-size: 24px;
    position: absolute;
    left: -103px;
    z-index: 1;
    top: -12px;
    transform: rotate(-180deg);
 }
.rangeSelectorLine label {
    width: 24px;
    color:#000;
    position:relative;

}
 .containerWraper{    
     width:calc(100% - 80px);     
     direction:rtl;
     float:left
 }
 #container {min-height: 400px}
 

 .highcharts-range-selector-buttons {
  display: none;
}
 .highcharts-range-inputs , input.highcharts-range-selector, highcharts-input-group{
  /*visibility: hidden;*/
  display: none;
}

 .topIcons{
     width: 150px;
     float: left;
 }

.topIcons span {
    width: 30px;
    height: 30px;
    margin: 0 3px;
    padding: 0;
    cursor: pointer;
    float:inherit;
    display:inline-block;
    cursor:pointer;
}

 
 .highcharts-legend-item{
    
 }
 .highcharts-axis-labels{
     font-size:12px;
 }


 #iconDownload { background:url(../../../images/portal/graphs/download.svg) no-repeat 0 0}
 #iconDownload:hover { background:url(../../../images/portal/graphs/icn-download-light-hover.svg) no-repeat 0 0}
 #iconLight { background:url(../../../images/portal/graphs/light.svg) no-repeat 0 0}
 #iconLight:hover { background:url(../../../images/portal/graphs/icn-light-light-hover.svg) no-repeat 0 0}
 #iconFull { background:url(../../../images/portal/graphs/full-screen.png) no-repeat 0 0}
 #iconFull:hover { background:url(../../../images/portal/graphs/icn-full-screen-light-hover.svg) no-repeat 0 0}
 #iconReset{ background:url(../../../images/portal/graphs/icn-refrash-light.svg) no-repeat 0 0;margin-top:3px}
 #iconReset:hover{ background:url(../../../images/portal/graphs/icn-refrash-light-hover.svg) no-repeat 0 0 ;margin-top:3px}

 #annotation-flag,
 #btnFlag { background:url(../../../images/portal/graphs/event.svg) no-repeat 0 0}

 /*tools background*/
 #annotation-line,
 #btnLine  { background:url(../../../images/portal/graphs/linyar.svg) no-repeat 0 0}

 #btnFreeLine { background:url(../../../images/portal/graphs/free-line.svg) no-repeat 0 0}

 #annotation-tunnel,
 #btnKilshon { background:url(../../../images/portal/graphs/kilshon.svg) no-repeat 0 0}
 
 #annotation-text,
 #btnText { background:url(../../../images/portal/graphs/text.svg) no-repeat 0 0}

 #annotation-fibonacci,
 #btnFibonacci { background:url(../../../images/portal/graphs/fibonacci.svg) no-repeat 0 0}

 #annotation-delete,
 #btnDelete { background:url(../../../images/portal/graphs/delete.svg) no-repeat 0 0}

 #annotation-line.active,
 #btnLine.selected { background:url(../../../images/portal/graphs/linyar2.svg) no-repeat 0 0}

 #btnFreeLine.selected { background:url(../../../images/portal/graphs/free-line2.svg) no-repeat 0 0}

 #annotation-tunnel.active,
 #btnKilshon.selected { background:url(../../../images/portal/graphs/kilshon2.svg) no-repeat 0 0}

 #annotation-flag.active,
 #btnFlag.selected { background:url(../../../images/portal/graphs/event2.svg) no-repeat 0 0}

 #btnText.selected { background:url(../../../images/portal/graphs/text2.svg) no-repeat 0 0}
 #btnFibonacci.selected { background:url(../../../images/portal/graphs/fibonacci2.svg) no-repeat 0 0}

 #annotation-delete.active,
 #btnDelete.selected { background:url(../../../images/portal/graphs/delete2.svg) no-repeat 0 0}

#container .crosshair-on-point .highcharts-tracker path:hover,
#container .crosshair-on-chart .highcharts-plot-background:hover,
#container .crosshair-on-annotation .highcharts-annotation:hover,
#container .crosshair-on-annotation .highcharts-flags-series:hover {
    cursor: crosshair;
}
 

 /* dark */

 


.graphFrame.dark {background:#314657}
.graphFrame.dark .rectangle span,
.graphFrame.dark label { color:#e5f0f8}
.graphFrame.dark .rectangle,
.graphFrame.dark .rectangle.last {border-color:#e5f0f8 !important}
.graphFrame.dark .rectangle.selected {background-color:#e5f0f8;}
.graphFrame.dark .rectangle.selected span { color:#2a3d4e}
.graphFrame.dark .tab:hover {background:none}
.graphFrame.dark .tab.selected {background:#415567;}
.graphFrame.dark .tab span {color:#e5f0f8}
.graphFrame.dark .tab.selected span {color:#fff}

.graphFrame.dark #divSearchIndicesBox #query_for_indices {background-color: #314657; color: white}

.graphFrame.dark #divSearchBox #divGraphHiddenSearch, 
.graphFrame.dark #divSearchIndicesBox #divGraphHiddenSearch{  background:#4a5e6f; border: 1px solid #314657}
.graphFrame.dark #divGraphHiddenSearch table tr {background:#4a5e6f}
.graphFrame.dark #divGraphHiddenSearch table tr:hover td, .graphFrame.dark #divGraphHiddenSearch table tr.selected, .graphFrame.dark #divGraphHiddenSearch table tr.over {background-color: #4a5e6f;}
.graphFrame.dark #divGraphHiddenSearch table tr td {color:#fff; opacity:1; padding-right:8px; background:#4a5e6f }
.graphFrame.dark #divGraphHiddenSearch table tr:hover td, .graphFrame.dark #divGraphHiddenSearch table tr.over td {color:#fff; background-color: #314657;}
.graphFrame.dark #divGraphHiddenSearch table tr td.title {color:#fff; opacity:1; padding-right:8px; background-color: #314657;}



/*.graphFrame.dark #divGraphHiddenSearch table tr:hover, .graphFrame.dark #divGraphHiddenSearch table tr.selected {background:#415567;}
.graphFrame.dark #divGraphHiddenSearch table tr td {color:#e0ecf5; padding-right:8px;}
.graphFrame.dark #divGraphHiddenSearch table tr:hover td , .graphFrame.dark #divGraphHiddenSearch table tr.over td {color:#fff} */
.graphFrame.dark #query_for_graph{ background-color: #3d5060; border:1px solid #e0ecf5; color:white; background: url(../../../images/portal/graphs/search1.svg) center left no-repeat;}
.graphFrame.dark #divGraphHiddenSearch{ box-shadow: 0 2px 4px 0 #2a3d4e;}
.graphFrame.dark #divGraphSearchBox {background-color: #3d5060; color:white; border:0;}
.graphFrame.dark #selIndicatorWraper{background-color: #3d5060; color:white; box-shadow: 0 2px 4px 0 #2a3d4e; border:0;}
.graphFrame.dark #selIndicatorWraper ul li {background-color: #3d5060; color:white; }
.graphFrame.dark #selIndicatorWraper ul li:hover, .graphFrame.dark #selIndicatorWraper ul li.selected {background-color:#4a5e6f; color:white}



.graphFrame.dark section.topMenu .graphType .lineGraph {background:url(../../../images/portal/graphs/tub-candle-2.svg) no-repeat 0 0;}
.graphFrame.dark section.topMenu .graphType .candleGraph {background:url(../../../images/portal/graphs/tub-candle-d.svg) no-repeat -26px 0;}  
.graphFrame.dark section.topMenu .graphType .lineGraph.active {background:url(../../../images/portal/graphs/tub-candle-d.svg) no-repeat 0 0;}
.graphFrame.dark section.topMenu .graphType .candleGraph.active {background:url(../../../images/portal/graphs/tub-candle-2.svg) no-repeat -26px 0;} 

.graphFrame.dark #btnLine { background:url(../../../images/portal/graphs/linyar1.svg) no-repeat 0 0}
.graphFrame.dark #btnFreeLine { background:url(../../../images/portal/graphs/free-line-d.svg) no-repeat 0 0}
.graphFrame.dark #btnKilshon { background:url(../../../images/portal/graphs/kilshon1.svg) no-repeat 0 0}
.graphFrame.dark #btnFlag { background:url(../../../images/portal/graphs/event1.svg) no-repeat 0 0}
.graphFrame.dark #btnText { background:url(../../../images/portal/graphs/text-d.svg) no-repeat 0 0}
.graphFrame.dark #btnFibonacci { background:url(../../../images/portal/graphs/fibonacci-d.svg) no-repeat 0 0}
.graphFrame.dark #btnDelete { background:url(../../../images/portal/graphs/delete-d.svg) no-repeat 0 0}

.graphFrame.dark #iconDownload { background:url(../../../images/portal/graphs/download1.svg) no-repeat 0 0}
.graphFrame.dark #iconDownload:hover { background:url(../../../images/portal/graphs/icn-download-dark-hover.svg) no-repeat 0 0}
.graphFrame.dark #iconLight { background:url(../../../images/portal/graphs/light1.svg) no-repeat 0 0}
.graphFrame.dark #iconLight:hover { background:url(../../../images/portal/graphs/icn-light-hover-dark.svg) no-repeat 0 0}
.graphFrame.dark #iconFull { background:url(../../../images/portal/graphs/icn-full-screen-dark.svg) no-repeat 0 0}
.graphFrame.dark #iconFull:hover { background:url(../../../images/portal/graphs/icn-full-screen-dark-hover.svg) no-repeat 0 0}
.graphFrame.dark #iconReset{ background:url(../../../images/portal/graphs/icn-refrash-dark.svg) no-repeat 0 0;  }
.graphFrame.dark #iconReset:hover{ background:url(../../../images/portal/graphs/icn-refrash-dark-hover.svg) no-repeat 0 0; }

.graphFrame.dark .rangeSelectorLine input {background:#46607f; color:#f3f8fc; border:1px #46607f solid}
.graphFrame.dark .legendAfter{background:#415567; color:white;border: 1px solid #415567;}
.graphFrame.dark .legendAfter {background:white; color: #415567; border: 1px solid white; }

.graphFrame.dark section.msgBox{background-color: #314657; box-shadow: 0 0 12px 0 rgba(63, 63, 63, 0.48); outline: 10000px rgba(0, 0, 0, 0.63) solid;}
.graphFrame.dark section.msgBox h2{ background-color: #405567;    color: #ffffff;}
.graphFrame.dark section.msgBox h2 span{ background: url(../../../images/portal/graphs/icn-x.svg) no-repeat 0 0;}
.graphFrame.dark section.msgBox ul li{   color: #e5f0f8; border: solid 1px #9cacb7;  background-color: #314657}
.graphFrame.dark section.msgBox ul li.selected{ background-color: #456178;  border: solid 1.5px #607281; color:#ffffff;}
.graphFrame.dark section.msgBox ul li.img span {background: url(../../../images/portal/graphs/icn-picture-dark.svg) no-repeat 0 0;    }
.graphFrame.dark section.msgBox ul li.excel span { background: url(../../../images/portal/graphs/icn-excel-dark.svg) no-repeat 0 0; }
.graphFrame.dark section.msgBox div {border-top: solid 0.8px #405567; padding-top: 20px;}
.graphFrame.dark section.msgBox div span.button{   background-color: #314657;  color:#e5f0f8;   border: solid 1px #fff;  }
.graphFrame.dark section.msgBox div span.button.selected{    background-color: #e5f0f8;  color:#314657}
.graphFrame.dark section.msgBox div.content{ color:white; }


/* end dark */

.highcharts-legend-item {    
    
            
}
.highcharts-legend-item:after:hover{
    
}
.fa-times-circle{

}
.fa{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.fa-times-circle:before {
    content: "\f057";
}
.legendAfter{
    width: 17px;
    height: 17px;
    font-size: 12px;
    font-family:sans-serif;
    padding:0 2px;    
    background:white;    
    display: inline-block;    
    text-align: center;
    box-sizing: border-box;
    border: 1px solid white;

}
.legendAfter:hover{
    background-color: #f3f8fc;    
    border-radius:50%;
    border: 1px solid #f3f8fc;

}

.divMainReportData, divMainGraphData{
    border-top: 1px #0076b7 solid !important;    
    padding-top:30px!important;
}

#legendSection{
    background: transparent;
    border-bottom: 5px solid #f3f8fc;
    padding: 10px 2px 0 2px!important;
    text-align:center;
    margin-top:30px;
     min-height:39px;
}
.graphFrame.dark #legendSection { background:rgb(65, 85, 103); border-bottom:5px solid #314657}
.graphFrame.dark #legendSection .legend {color:#fff}
.graphFrame.dark #legendSection .legend span.x {margin-right:0; background: rgb(65, 85, 103);/* background-color: #000;  */     font-size: 12px;}
.graphFrame.dark #legendSection .legend span.x:hover { background-color: #000;   }


#legendSection .legend{  display: inline-block; margin:7px 0 0 30px; font-size:14px; text-align:right; font-family: almoniDL700;}
#legendSection .legend span.x{font-size: 14px; border-radius: 50%;  display: inline-block; cursor: pointer;  background-color: white;  padding: 1px 4px 3px;  font-family: monospace;  margin-top:-2px}
#legendSection .legend .en {direction: ltr; display:inline-block; margin-left:5px}
#legendSection .legend span.x:hover { background-color: #f3f8fc;}
#legendSection .legend span.circule{ width: 9px;    height: 9px;    border-radius: 50%;    margin:0 5px; border: 0px;    display: inline-block;}

.watermark{font-size:16px; /*text-shadow: 1px 1px 1px #000, 3px 5px blue;*/}
/*==== instrument daily graph */
#graphN .phGeneralInstrumentGraph .containerWraper #container {min-height: 250px}
#graphN .phGeneralInstrumentGraph .containerWraper { width: 100%;}
#graphN .phGeneralInstrumentGraph .rangeSelectorLine .customRangeSelectorButtons{    width: 100%;    float: right;   }

/*#graphN .phGeneralInstrumentGraph .graphFrame {  min-height: 333px;}*/
#graphN .tab {opacity:1}
#graphN .tab span {font-size:13px}
#graphN #iconDownload {    background-position-y: -5px;}
#graphN #query_for_graph { width:285px; outline:0} 
#graphN .queryForGraph { font-size:14px;  font-weight:normal;  font-family: almoniDL400;}
#graphN #divGraphSearchBox {  margin-top: 0px !important;  left: auto;    width: auto; max-height:345px}
#tblHiddenSearch tr td.title2 {
    padding: 20px !important
}
#graphN #divGraphHiddenSearch table tr td {
    font-size: 13px;
    padding: 5px 10px;
}


#graphN #divGraphHiddenSearch table tr td.title {
    direction: rtl !important;
    border-top: 1px #fff solid;
    background: #f1dfcf;
}
#graphN #selIndicatorWraper {right:0; width:84px}
 
#graphN .phGeneralInstrumentGraph #iconFull{ display: none;}
#graphN .phGeneralInstrumentGraph #iconLight{ display: none}

#graphN .phGeneralInstrumentGraph section.topMenu {    margin-left: 0}
#graphN #legendSection .legend span.x {    font-size: 14px;    padding: 0px 5px 1px;}
#graphN #legendSection .legend {font-family: almoniDL400;font-size: 12px; }
#graphN #legendSection .legend{  margin:7px 0 0 10px; }

#graphN .graphFrame {    padding: 10px;    z-index: 1;    position: relative;}
#graphN .tab {width:62px; height:30px; line-height:30px; margin-top:-5px;}
#graphN .indicatorsAndCompare{
     margin-right: 0;
 }

.sub_title_bar .total {float:left}
.trAllResults  {height:50px}
.trAllResults td a {
    direction: rtl
}

@media only screen and (max-width: 480px) {
    #divGraphHiddenSearch {
        width: 99%;
        max-height: 200px;
    }
    #tblHiddenSearch tr td.title2 {padding:20px 10px !important}

    .graphFrame #divGraphHiddenSearch {
        overflow-x: scroll
    }

    .graphFrame #divGraphSearchBox {
        width: 93vw !important;
    }

    .graphFrame #query_for_graph {
        width: 83vw !important;
    }


    #divGraphHiddenSearch::-webkit-scrollbar {
        display: block;
        width: 10px;
    }

    #divGraphHiddenSearch::-webkit-scrollbar-thumb {
        background: #ddd;
    }





    #divCompareList {
        overflow-x: scroll !important;
    }

    .graphFrame {padding:0 !important}
    #CenterColumn .graphFrame.comparison .containerWraper {
        margin-top: 50px;
        width: 100%
    }
        #CenterColumn .graphFrame.comparison .containerWraper #container {min-height:initial !important}

        #graphN .phGeneralInstrumentGraph .containerWraper #container {
            min-height: 160px;
        }
    .rectangle {text-align:center; border-left:1px solid #97133f;}
    .rectangle span  { font-size: 19px;    width: auto;    font-family: almoniTzar300; padding:2px; line-height:1 }
    .topIcons {display:none}
    
    #CenterColumn .graphFrame.comparison  .containerWraper .rangeSelectorLine .customRangeSelectorButtons {width: calc(100% - 10px);
    padding: 0 5px; grid-gap: 1px; display: grid; grid-template-columns: repeat(4, 1fr);}

    .rangeSelectorLine .customRangeSelectorButtons {   width:115%; display:flex ; margin-bottom:20px   }
    #topMainColumn {margin:0}
 

    section.topMenu {
        margin: 0
    }
        section.topMenu .resolutionGroup {
            float: none;
            width: 100%;
            display: flex;
            justify-content: center;
            margin-bottom: 20px;
        }
        section.topMenu .graphType  {
            display: flex;
            justify-content: center;
            float: none;
            width: 100%;
            margin:10px 0;
        }

        section.topMenu .indicatorsAndCompare {
            display: flex;
             
            float: none;
            width: 100%;
            margin: 10px 0;
        }



    #container {min-height:initial; margin-bottom:20px
    }

    .rangeSelectorLine label {
        font-size: 12px;
    }
   .rangeSelectorLine input {padding:5px}
    .rangeSelectorLine label:after {
        top: -7px;
        height: 24px;
    }

    .customRangeSelectorInputs label:after {
        top: -16px;
    }
        section .indicatorForm {
        width: 98%
    }
    section.indicatorForm h2 {font-size:15px}
    section.indicatorForm .indicatorFormContent ul.fields {padding-right: 10px !important;}

}






/* etf/fund comparison engin*/
#CenterColumn h3 {
    font-family: almoniDL400;
    font-size: 27px;
    height: 35px !important;
    font-weight: normal;
}
div[id*="Score1_divStats"] {
    margin-top: 0;
}

#CenterColumn .graphFrame.comparison .containerWraper{ width: 100% ; min-height: 240px;}
#CenterColumn .graphFrame.comparison  section.topMenu .comparisonSearch { position: relative;}
.comparisonSearch #divSearchBox , .comparisonSearch #divSearchIndicesBox{ position: absolute; }
.comparisonSearch #divSearchBox { right: 0}
#divSearchIndicesBox { right: 170px}
#divSearchBox #query_for_graph , #divSearchIndicesBox #query_for_indices{ padding:0; width: 100%; background: url(../../../images/portal/graphs/dropupLight.svg) center left no-repeat;}
#divSearchBox.open #query_for_graph , #divSearchIndicesBox.open #query_for_indices{ padding:0; width: 100%; background: url(../../../images/portal/graphs/dropup_down.svg) center left no-repeat;}
#divSearchBox .queryForGraph, #divSearchIndicesBox .queryForGraph { margin-top: 0;}
#query_for_indices {
    -webkit-appearance: none;
}
.searchBox { width: 160px ; border: solid 1px #dadfe1 }
#CenterColumn .graphFrame.comparison  .rangeSelectorLine .customRangeSelectorButtons {width: 100%;}
#divSearchBox #divGraphHiddenSearch, #divSearchIndicesBox #divGraphHiddenSearch{
     width: 99%;
     border: 1px solid #dadfe1; 
   
     max-height: 300px;          
     position: relative;
     top: 0;
     margin: 24px 0px 0px 0px;
     background-color: white;
 }
 
  #divSearchIndicesBox #divGraphHiddenSearch{ overflow-y: scroll; overflow-x: hidden; }


#CenterColumn .graphFrame  section.topMenu{ margin-left: 0;}


#CenterColumn .graphFrame.comparison  .containerWraper #container { min-height: 320px;}

#divCompareList {
    margin-top: 20px;
    overflow: hidden;
    font-family: almoniDL400;
 
}
#divCompareList table td.instrumentTitle {background:#fff1e5; font-size: 13px; font-weight:bold}
#divCompareList table td.tdInstrumentData { direction: ltr;}

#divCompareList table tr td.tdInstrumentData.last{ text-align:left}
.instrumentGraphSquare{ border :0; border-radius: 50%}


/* Let's get this party started */
#CenterColumn ::-webkit-scrollbar {
    width: 12px;
}

/* Track */
#CenterColumn ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
#CenterColumn ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(204,204,204,0.8); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#CenterColumn ::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(204,204,204,0.4); 
}

/* funds home page */

#FundComparison #graph_box #CenterColumn {margin-top: -7px; width: 670px;}
#FundComparison #aChannel, [id*="data_tab_"] { overflow: visible}

/* etf home page */
.instrumentGraphSquare1,
.instrumentGraphSquare2, .instrumentGraphSquare3,
.instrumentGraphSquare4, .instrumentGraphSquare5 {
    border: 0;
    border-radius: 50%;
    
}
.tblChannel td.first{
    direction: rtl;
}
.highcharts-pie-series .highcharts-point {
	stroke: #EDE;
	stroke-width: 2px;
}

.highcharts-pie-series .highcharts-data-label-connector {
	stroke: silver;
	stroke-dasharray: 2, 2;
	stroke-width: 2px;
}
.highcharts-text-outline{
    stroke: none;
}