/* Minification failed. Returning unminified contents.
(11,35): run-time error CSS1039: Token not allowed after unary operator: '-amar-border-color'
(177,28): run-time error CSS1039: Token not allowed after unary operator: '-amar-secondary-bg'
(178,24): run-time error CSS1039: Token not allowed after unary operator: '-amar-secondary-border'
(186,32): run-time error CSS1039: Token not allowed after unary operator: '-amar-secondary-border'
(198,48): run-time error CSS1039: Token not allowed after unary operator: '-amar-secondary-border'
(204,48): run-time error CSS1039: Token not allowed after unary operator: '-amar-secondary-border'
 */
select#AmarSymbols {
    background: transparent;
    position: relative;
    font-size: 1.6rem;
    margin: 0;
    padding: 1.4rem 1rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-bottom: 2px solid var(--amar-border-color,#ddd);
    outline: none;
}

ul.AmrStockList {
    padding: 0;
    margin: 0;
}
    ul.AmrStockList li {
        margin: 0;
        border-bottom: 1px solid #e0e3eb;
    }
    ul.AmrStockList li.head {
        display: flex;
        flex: 1 1 auto;
        min-width: 100%;
        color: #4a4a4a;
        padding-top: .4rem;
        padding-bottom: .4rem;
        border-bottom: 2px solid #e6ecef;
        font-size: 1.3rem;
    }
    
    ul.AmrStockList li .s0, ul.AmrStockList li .s1, ul.AmrStockList li .s2, ul.AmrStockList li .s3, ul.AmrStockList li .s4 {
        display: flex;
        min-width: 0;
        max-width: 100%;
        height: 2.1rem;
        padding-top: 3px;
        padding-bottom: 3px;
        align-items: center;
        overflow: hidden;
        white-space: nowrap;
        justify-content: flex-end;
    }
    ul.AmrStockList li .s0 {
        padding-left: .5rem;
    }
    ul.AmrStockList li .s1 {
        justify-content: flex-start;
        padding-right: 4px;
        padding-left: 1rem;
        flex-grow: 1;
        flex-shrink: 0;
    }
    ul.AmrStockList li .s4 {
        flex: 0 1 6.5rem;
        padding-right: .875rem;
    }

    ul.AmrStockList li a {
        padding: .4375rem 0;
        display: flex;
        flex: 1 1 auto;
        min-width: 100%;
        color: #4a4a4a;
        font-size: 1.4rem;
    }
#addNewWatchList input{
    max-width:100%;
}
#addNewWatchList input, #addNewWatchList button {
    height: 3rem;
}

#addNewWatchList .postfix.button {
    padding: 0.5rem;
}

.flex {
    display: flex;
    flex: 1 1 auto;
    min-width: 100%;
}

    .flex .s1 {
        justify-content: flex-start;
        flex-grow: 1;
        flex-shrink: 0;
    }
.AmarWatchlist .wlist {
    height: 3.3rem;
}
.AmarWatchlist .ctrl {
    width: 3.3rem;
    height: 3.3rem;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #787b86;
    padding:0;
    background:transparent;
}


#watchlistChooser .srcWrap {
    padding: 0.3rem 1rem;
    border-bottom: 1px solid #ddd;
    width:100%;
}

    #watchlistChooser .srcWrap input {
        border: none;
        background: #fff url(/Content/img/search-icon.png) no-repeat scroll left center;
        font-size: 1.6rem;
        background-size: 2rem;
        background-position-x: .3rem;
        padding: .5rem 1rem .5rem 2.5rem !important;
        margin-bottom: 0;
        box-shadow: none;
        width:100%;
        max-width:100%;
    }

#watchlistChooser .list, #deleteWatchList .list {
    width: 100%;
}

    #watchlistChooser .list ul, #deleteWatchList .list ul {
        margin: 0;
        width: 100%;
    }

    #watchlistChooser .list li, #deleteWatchList .list li {
        border-bottom: 1px solid #ddd;
        display: block;
        align-items: center;
        padding: .6rem 2rem 0.6rem;
        font-size: 1.5rem;
    }

        #watchlistChooser .list li a {
            display: flex;
            color: initial;
        }

        #watchlistChooser .list li:hover {
            background-color: #f0f3fa;
        }

        #watchlistChooser .list li .code {
            flex-grow: 0;
            width: 15rem;
        }

        #watchlistChooser .list li .name {
            flex: 1 1 auto;
        }

        #watchlistChooser .list li i {
            line-height: 2.4rem;
        }

        #deleteWatchList .list li input {
            margin-right: 1rem;
        }

.f-dropdown li.divider {
    border-top: 1px solid #ddd;
}

.f-dropdown li a {
    padding: 1rem
}

ul#dropSettings {
    background-color: var(--amar-secondary-bg,#fff);
    border-color: var(--amar-secondary-border,#ddd);
}

    ul#dropSettings li {
        cursor: initial;
    }

        ul#dropSettings li.divider {
            border-color: var(--amar-secondary-border,#ddd);
        }

    ul#dropSettings.open {
        width: 20rem;
        right: 0;
        left: initial !important;
    }

#dropSettings::before {
    left: initial;
    right: 15px;
    border-color: transparent transparent var(--amar-secondary-border,#fff) transparent;
}

#dropSettings::after {
    left: initial;
    right: 14px;
    border-color: transparent transparent var(--amar-secondary-border,#ccc) transparent;
}
select {
    margin-bottom: 0;
}

.border-r {
    border-right: 1px solid #ddd;
}

.border-l {
    border-left: 1px solid #ddd;
}


    #mainChartCont .head {
        margin: 0.5rem 0;
        position: relative;
        border: 1px solid #ddd;
        border-radius: 3px;
    }

        #mainChartCont .head select {
            display: block;
            font-size: 1.9rem;
            border: none;
            background-color: transparent;
            cursor:pointer;
        }
            #mainChartCont .head select:hover {
                background-color: #f0f3fa;
            }
            #mainChartCont .head .ltp {
                padding-left: 1rem;
            }

        #mainChartCont .head .summery .columns {
            margin-top: .6rem;
        }

        #mainChartCont .head .summery .tt {
            font-size: 1.3rem;
            color: #747474;
        }

        #mainChartCont .head .summery .vl {
            font-weight: 700;
        }

#lastChange {
    white-space: nowrap;
}

#chart-volume {
    min-height: 32rem;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

#colortab {
    margin: 0;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    padding-bottom: 0.5rem;
    padding-left: 2rem;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

    #colortab .item {
        font-size: 1.3rem;
        line-height: 2.4rem;
        white-space: nowrap;
        font-weight: 400;
    }

        #colortab .item span {
            font-weight: normal;
        }

        #colortab .item .sqr {
            width: 1rem;
            height: 1rem;
            display: inline-block;
            margin-right: .5rem;
        }

.bg-gray {
    background-color: #939598
}

.bg-light-green {
    background-color: #048215
}

.bg-red {
    background-color: #cc075a
}

.bg-blue {
    background-color: #079de1
}

div.slider {
    position: relative;
    border-radius: 0;
    background-color: #e0dfdf;
    border: none;
    height: 9px;
    margin-top: .3rem;
}

    div.slider .ui-slider-handle {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAATBAMAAAC0B+rjAAAAKlBMVEX///+ZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZk4FLA7AAAADXRSTlMAKjlJSl1xcnPt9fr+OpJuFAAAADxJREFUCNdjqLl79+6dBAbWvXfvbmVgYLC6e8sASDHNncQAArICYIqXgSIKYgrUTK+7txwYYPb1gGxvAADZmRbEUFgXpwAAAABJRU5ErkJggg==') center no-repeat;
        width: 1.1rem;
        height: 1.9rem;
        border: none;
        position: absolute;
        top: -.5rem;
        margin-left: -.5rem;
    }

    div.slider .handleText {
        position: absolute;
        top: -2.3rem;
    }

        div.slider .handleText.mx {
            right: 0;
        }

#dayRange {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    border: 1px solid #ddd;
    padding: 0.5rem 1rem 1rem;
    border-radius:3px;
}

    #dayRange .name {
        margin-bottom: 1rem;
        font-weight: 700;
        font-size: 1.5rem;
    }

#mainChartCont .shortcut {
    display: none;
}

    #mainChartCont .shortcut .button {
        min-height: 2.6rem;
        min-width: 3rem;
        margin-bottom: 0;
        padding: .4rem;
        background-color: transparent;
        color: #747474;
        border: 1px solid #ddd;
        font-size: 1.4rem;
    }

        #mainChartCont .shortcut .button:hover {
            background-color: #f0f3fa;
        }

#aside {
    margin-top: 1rem;
}

.tabs-content {
    margin-bottom: 0.5rem;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-bottom-left-radius: .3rem;
    border-bottom-right-radius: .3rem;
}

#aside .tabs .tab-title {
    width: 25%;
}

.tabs li.tab-title:first-child a {
    border-top-left-radius: .3rem;
}

.tabs li.tab-title:last-child a {
    border-top-right-radius: .3rem;
}

.tabs .tab-title a {
    font-size:1.4rem;
    padding: .5rem 0;
    display: block;
    text-align: center;
    background-color: transparent;
    color: #433;
    border: 1px solid #ddd;
}

.tabs .tab-title.active a {
    border-bottom: none;
}

.tabs .tab-title > a:hover {
    background-color: #f0f3fa;
}

.tabs .tab-title.active > a:hover {
    background-color: #fff;
}

.tabs-content > .content {
    margin-bottom: 0;
}

#aside .tabs-content > .content {
    overflow: auto;
    padding-bottom: 0;
}

#aside .accordion {
    margin: 0;
}

    #aside .accordion .accordion-navigation > a {
        background-color: #f1f3f6;
        padding: 0.5rem 1rem;
        font-weight: 700;
        font-size: 1.2rem;
        color: #433;
    }

    #aside .accordion .accordion-navigation + li {
        margin-top: .3rem;
    }

    #aside .accordion .accordion-navigation.active > a {
        background-color: #e9f8ff
    }

    #aside .accordion .accordion-navigation:before, #aside .accordion .accordion-navigation:after {
        border-color: #bdbaba;
    }

.accordion .accordion-navigation > .content {
    position: relative;
    padding: 0;
}

#aside .side-nav li a {
    padding: 0.4375rem 0;
    display: flex;
    flex: 1 1 auto;
    min-width: 100%;
    color: #4a4a4a;
    font-size:1.4rem;
}

#aside .side-nav li i.fa {
    color: #b9b8b8;
}

.side-nav {
    padding: 0;
}

    .side-nav li {
        margin: 0;
    }

        .side-nav li.head {
            display: flex;
            flex: 1 1 auto;
            min-width: 100%;
            color: #4a4a4a;
            padding-top: .4rem;
            padding-bottom: .4rem;
        }

        .side-nav li + li {
            border-top: 1px solid #e0e3eb;
        }

        .side-nav li > span, .side-nav li a > span {
            display: flex;
            min-width: 0;
            max-width: 100%;
            height: 2.1rem;
            padding-top: 3px;
            padding-bottom: 3px;
            align-items: center;
            overflow: hidden;
            white-space: nowrap;
            justify-content: flex-end;
        }

        .side-nav li span > span {
            flex: 0 1 auto
        }

        .side-nav li span.s0 {
            padding-left: 0.5rem;
        }
        .side-nav li.head{
            color:#747474;
            font-size:1.3rem;
        }
        .side-nav li span.s1 {
            justify-content: flex-start;
            padding-right: 4px;
            padding-left: 0.5rem;
            flex-grow: 1;
            flex-shrink: 0;
        }

        .side-nav li span.s2 {
            justify-content: flex-end;
        }

        .side-nav li span.s3 {
            flex: 0 1 50px;
            padding-right: 0.4375rem;
        }

        .side-nav li span.s4 {
            flex: 0 1 8rem;
            padding-right: 0.875rem;
        }

#depth {
    position: relative;
    margin-bottom: 0.9375rem;
}

    #depth .t {
        font-weight: 700;
        font-size: 1.5rem;
        margin: 0;
        padding: 0.6rem 0;
    }

    #depth .tabs {
        float: right;
        margin-top: -3.2rem;
    }

        #depth .tabs li a {
            border-bottom: none;
        }

        #depth .tabs > li > a {
            padding-left: 2rem;
            padding-right: 2rem;
        }

    #depth .tabs-content {
        border-top: 1px solid #ddd;
        border-top-left-radius: .3rem;
    }

        #depth .tabs-content .content {
            min-height: 27.1rem;
        }

#panel5 {
    padding: 0;
}

.notavail {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid #ddd;
    padding: .5rem 2rem;
    background-color: rgba(0, 0, 0, 0.025);
    transform: translate(-50%, -50%);
    white-space: nowrap;
}

#panel6 {
    position: relative;
    min-height: 274px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
    #panel6 img{
        width:100%;
    }
    .buysell-table {
        width: 100%;
        border-collapse: collapse;
        margin: 0;
        border: none;
        border: 1px solid #ddd;
    }

    .buysell-table th, .buysell-table td {
        font-weight: 200;
        line-height: 1.4;
        border: 1px solid #ddd;
    }

    .buysell-table tr td {
        padding: 0.4rem 1rem;
        text-align: right;
    }

    .buysell-table .top {
        text-align: center;
        color: #ffffff;
        line-height: 1.25;
        padding: 0.5rem 0.625rem 0.625rem;
        font-weight: 700;
    }

        .buysell-table .top.buy {
            background-color: #4bb659;
            border: 1px solid #4bb659;
        }

        .buysell-table .top.sell {
            background-color: #cc075a;
            border: 1px solid #cc075a;
        }

    .buysell-table th.mid {
        color: #433;
        background-color: #f1f3f6;
        line-height: 1.25;
        text-align: center;
        width: 50%;
        border-right: 1px solid #ddd;
    }

.blockHead, .divTable .top {
    background-color: #e9f8ff;
    color: #433;
    font-weight: 700;
    font-size: 1.5rem;
    padding: 0.7rem 0;
    text-align: center;
}
.blockHead {
    border: 1px solid #ddd;
    margin: 0;
    padding: 0.5rem 0;
}
#volumeSummery {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.divTable> .row > .columns {
    border: 1px solid #ddd;
    border-top: none;
    padding: 0.4rem 1rem;
}

.divTable .row > .columns.top {
    border-top: 1px solid #ddd;
    padding: 0.5rem 0;
}

.divTable .stat {
    text-align: right;
}

.bg-gray1 {
    background-color: transparent;
}

.bg-gray2 {
    background-color: #F9F9F9;
}

.bg-gray3 {
    background-color: #F9F9F9;
}
#volumeBarChart{
    min-height:30px;
}
#depthChart {
    width: 100%;
}
#panel1>.head{
    padding:0 1rem;
}

@media (pointer: fine) {
    #aside .tabs-content > .content::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    #aside .tabs-content > .content::-webkit-scrollbar-corner {
        display: none;
    }

    #aside .tabs-content > .content::-webkit-scrollbar-thumb {
        border: 1px solid;
        border-color: #f1f3f6;
        border-radius: 3px;
        background-color: #d1d4dc;
    }

    #aside .tabs-content > .content::-webkit-scrollbar-track {
        background-color: transparent;
        border-radius: 3px;
    }
}

@media(min-width:640px) {
    #colortab {
        display: flex;
        flex-wrap: wrap;
        justify-content:space-evenly;
        padding-left:0;
    }

        #colortab .item {
            flex: 1 1 auto;
            flex-grow: 0;
            flex-shrink: 0;
        }
}

@media(min-width:768px) {
    #mainChartCont .head select {
        margin-top: 0.6rem;
    }

    #mainChartCont .shortcut {
        display: block;
        text-align: right;
    }

    #mainChartCont .head .ml-3 {
        margin-left: 1.5rem !important;
    }

    #mainChartCont .shortcut .br {
        display: block;
        width: 100%;
    }

    #lastLTP {
        text-align: center;
    }

    #colortab .item {
        flex: 1 1 auto;
        flex-grow: 0;
        flex-shrink: 0;
    }

    .bg-gray1 {
        background-color: #F9F9F9;
    }

    .bg-gray2 {
        background-color: transparent;
    }


    #chart-volume {
        min-height: 40rem;
    }

    
}

@media(min-width:1024px) {
    #aside {
        width:25%;
        left: 75%;
        right: auto;
    }
    #mainChartCont {
        width:75%;
        right: 25%;
        left: auto;
    }

    #mainChartCont .head {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
    #dayRange, #volumeSummery {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
    #aside .tabs-content > .content {
        height: 52.7rem;
    }
    #depth .t {
        text-align: center
    }
}