@charset "utf-8";
/* CSS Document */
.gold-rate-table .product-hl-table-head {padding:10px;}
.bank-prod-page .gold-rate-table {text-align:center;}
.bank-prod-page .gold-rate-table .table-curved td{border-left: 1px solid #ddd;}
.bank-prod-page .gold-rate-table .table-curved td:first-child {border-right: 0;}
.bank-prod-page .gold-table-pad-remove {padding:0;}

.bank-prod-page .gold-rate-table {text-align:center;}
.bank-prod-page .gold-rate-sub{width: 600px; margin: 0 auto;}
.bank-prod-page .gold-rate-table .table-curved {border-collapse: separate;border: solid #ddd 1px;border-radius: 0;border-bottom-left-radius: 6px;border-bottom-right-radius: 6px;border-top: 0;background: none repeat scroll 0 0 #f4f5f7;margin: 0 auto;text-align: center;font-size: 14px;}
.bank-prod-page .gold-rate-table .table-curved tr td {border-top: 1px solid #ddd; vertical-align: middle;padding: 9px 15px; text-align: center;}
.bank-prod-page .gold-rate-sub .table-curved tr td {padding: 3px 15px;}
@media only screen and (min-device-width: 320px) and (max-device-width: 630px) {
    .bank-prod-page .gold-rate-table .table-curved tr td {padding: 9px 5px;}
}
@media only screen and (max-width: 767px){
    .gold-rate-today{width:100%}
}


.heightcontroltable{height: 480px;overflow-y: scroll;display: block;overflow-x: hidden;}
.heightcontroltable tbody{display: table;width: 100%;}
.heightcontroltable::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);  background-color: #F5F5F5;}
.heightcontroltable::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;}
.heightcontroltable::-webkit-scrollbar-thumb {background-color: #999;}
.graphSection{background:#4bacc9; padding: 0;border: 1px solid #ddd;   border-top-right-radius: 6px;
    border-top-left-radius: 6px;}
.graphSection li{background: #3e8bb4;display: inline-block;padding: 10px 25px;margin: 10px 5px;color: #fff;border-radius: 2px;font-size: 12px;cursor: pointer;}
.graphSection .active{background: #fff;color: #34495e;}
.graphArea{background:#fff;min-height: 300px}
.graphRadioSection{padding: 15px;text-align: right;}
.graphRadioSection .radioBtnStyle{display: inline-block;}
.graphRadioSection .radioBtnStyle .firstIcon{border: 2px solid #fff}
.graphRadioSection .radioBtnStyle .secondIcon{background:#fff;}
.graphRadioSection .radiobtnbox{display: inline-block;margin-right: 18px }
.graphRadioSection label{color: #fff;font-weight: bold;}
.mobileGraph{display: none}.desktopGraph{display: block;}
.graphCommodity{width: 100%;height: 450px;}

@media only screen and (max-width: 767px){
    .mobileGraph{display: block}
    .desktopGraph{display: none;}
    .graphCommodity{width: 100%;height:190px;}
    .graphSection li{padding: 8px 20px;}
    .graphRadioSection .radiobtnbox{margin-right: 5px;}
}
.graphLoaderCommodity {
    width: 100%;
    position: absolute;
    height: 450px;
}

@media only screen and (max-width: 767px){
    .graphLoaderCommodity {
        height: 190px;
    }
}
.overlay {
    fill: none;
    pointer-events: all;
}
.focus circle {
    fill: #38acc9;
}

.focus text {
    font-size: 14px;
}

.tooltipCommodity {
    fill: #38acc9;
    stroke: #000;
}

.tooltip-date, .tooltip-price {
    font-weight: bold;
}
.axis path,.axis line{fill: none;stroke-width: 2px;}
.axis path{stroke: rgba(52, 73, 94, 0.5);}
.axis line{stroke: rgba(52, 73, 94, 0.5);}
.line{fill: none;stroke:#38acc9;stroke-width: 2px;}

.tick text {font-size:16px;font-weight: bold;color: #0ff;fill: #34495e;text-transform: uppercase;}
.x.axis .tick line{opacity:.2}
.y.axis .tick line{opacity:.1}
g.x.axis,g.y.axis {fill: #34495e;}

.downvalue{color: #ed6779;font-weight: bold}
.upvalue{color: #52b8c9;font-weight: bold}
.heightfix tr td{height: 55px}
.bigfont{font-size: 40px}
.graphSectionHeading{font-size: 26px;font-weight: bold;margin-bottom: 10px;}
.disable-selection {
    -moz-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}