/*!
    全域設定: inline-block
*/
.fix-inline-display {
    font-size: 0;
}

    .fix-inline-display > * {
        font-size: 14px;
    }


/*!
    WLS-Tabs
*/
.wls-ui-tabs {
    width: 100%;
}

.wls-ui-tabs-nav {
    width: 100%;
    text-align: left;
}

.wls-ui-tab {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    cursor: pointer;
    border: 1px solid #c8c8c8;
    border-bottom: 0;
    padding: .3em 0;
    text-align: center;
    margin-left: 1px;
}

    .wls-ui-tab:first-child {
        margin-left: 0;
    }

    .wls-ui-tab.active {
        cursor: default;
        border-bottom: 1px;
    }

    .wls-ui-tab a {
        display: block;
        width: 100%;
        height: 100%;
        padding: .5em 1em;
        text-decoration: none;
    }

.wls-ui-tabs-contents {
    width: 100%;
    *width: 90%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1em;
}

.wls-ui-tabs-content {
    width: 100%;
}

/*!
    WLS-data
*/
.wls-data-wrapper {
    padding: 1em 1em;
    margin: 0 0 1em 0;
    -weblit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
}



/* 上下五檔 */
.wls-transactions-panel {
    display: none;
    position: absolute;
    z-index: 99999;
    top: 8px;
    *top: 1px;
    right: 60px;
    width: 300px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
    -ms-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
    -o-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
    border: 1px solid #ccc\9;
}

.wls-transactions-data {
    width: inherit;
    *width: 100%;
}

    .wls-transactions-data .price {
        width: 25%;
    }

    .wls-transactions-data .volumn {
        width: 25%;
    }

    .wls-transactions-data td.price,
    .wls-transactions-data td.volumn {
        padding: .3em 0;
    }

/*!
    WLS-每條可拖拉的項目
*/


/*列表模式*/
.wls-view-mode-list .wls-data-title {
    padding: .5em 0;
    width: 100%;
}

.wls-view-mode-list .wls-data-item {
    margin-bottom: 8px;
    width: 100%;
    -weblit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

    .wls-view-mode-list .wls-data-item:hover {
        border: 1px solid transparent;
    }

    /* 欄位設定 */
    .wls-view-mode-list .wls-data-title > .title,
    .wls-view-mode-list .wls-data-item > .item {
        display: inline-block;
        *display: inline;
        *zoom: 1;
    }

.wls-view-mode-list .wls-data-title > .title {
    margin-bottom: 1em;
}

.wls-view-mode-list .wls-data-item > .item {
    padding: 1em 0;
}

.wls-view-mode-list .wls-data-name {
    width: 155px;
}

    .wls-view-mode-list .wls-data-name .symbol,
    .wls-view-mode-list .wls-data-name .subtitle {
        display: inline-block;
        *dispay: inline;
        *zoom: 1;
        text-indent: 1em;
        *text-indent: .8em;
    }
    .wls-view-mode-list .wls-data-name .symbol {
        width: 80px;
        *width: 80px;
    }
    .wls-view-mode-list .wls-data-name .subtitle {
        color:#989898
    }

.wls-view-mode-list .wls-data-price {
    width: 80px;
}

.wls-view-mode-list .wls-data-rate {
    width: 90px;
}

.wls-view-mode-list .wls-data-num {
    width: 90px;
}

.wls-view-mode-list .wls-data-volumn {
    width: 90px;
}

.wls-view-mode-list .wls-data-range {
    width: 90px;
}

.wls-view-mode-list .wls-data-system {
    width: 70px;
}

.wls-view-mode-list .wls-data-view {
    position: relative;
    width: 145px;
}

.wls-view-mode-list .wls-data-btn-view {
    text-decoration: none;
    position: absolute;
    right: 0;
    top: 3px;
    *top: -1px;
}

.wls-view-mode-edit .wls-data-delete {
    position: relative;
    width: 120px;
    *width: 100px;
    *top: -11px;
    *right: -15px;
}

.wls-view-mode-edit .wls-data-btn-delete {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 3px;
    *width: 54px;
}


/*方塊模式*/
.wls-view-mode-block .wls-data-item {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    position: relative;
    width: 238px;
    margin-left: 5px;
    margin-bottom: 10px;
    -weblit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    behavior: url(/inc/css/PIE.htc);
    cursor: pointer;
}

    /* 欄位設定 */
    .wls-view-mode-block .wls-data-item > .item {
    }

.wls-view-mode-block .wls-data-name {
    padding: 8px 0 0 16px;
}

    .wls-view-mode-block .wls-data-name > a {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        text-decoration: none;
        padding: .3em .5em;
        padding: .6em .5em\0/;
    }

/* 編輯模式 */
.wls-view-mode-edit .wls-data-item {
    cursor: move;
}

    .wls-view-mode-edit .wls-data-item.ui-sortable-helper {
        border: 1px solid transparent;
    }

    .wls-view-mode-edit  .wls-data-name {
        width: 410px;
    }

@media all and (-ms-high-contrast:none) {
    *::-ms-backdrop, .wls-view-mode-block .wls-data-name > a {
        padding: .6em .5em;
    }
    /* IE11 */
}

.wls-view-mode-block .wls-data-price {
    font-size: 36px;
    padding: 0 0 3px 16px;
}

.wls-view-mode-block .wls-data-rate {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 76px;
    *width: 70px;
    padding: 0 0 0 8px;
    margin-bottom: 8px;
}

.wls-view-mode-block .wls-data-num {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 76px;
    *width: 70px;
    margin-bottom: 8px;
}

.wls-view-mode-block .wls-data-volumn {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 76px;
    *width: 70px;
    margin-bottom: 8px;
}

.wls-view-mode-block .wls-data-range {
    display: none;
}

.wls-view-mode-block .wls-data-view {
    position: relative;
    display: none;
}

.wls-view-mode-block .wls-data-btn-view {
    width: 30px;
}

.wls-view-mode-block .description {
    font-size: .7em;
}

/* 上下五檔 */
.wls-view-mode-block .wls-transactions-panel {
    top: 0;
    left: 0;
    width: 100%;
    font-size: 12px;
}


/*!
    WLS-function
*/
.wls-function-wrapper {
}

    .wls-function-wrapper.top {
        display: inline-block;
        /* fix IE7 下拉面板被內容的relative物件覆蓋 */
        *position: relative;
        *z-index: 99999;
    }

    .wls-function-wrapper.bottom {
        width: inherit;
        margin-bottom: 2em;
    }

.wls-function-box {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin-left: 1em;
}

    .wls-function-box:first-child {
        margin-left: 0;
    }

/* 關鍵字搜尋 */
.wls-search-withCategory {
    width: inherit;
    position: relative;
}

    .wls-search-withCategory:focus {
        outline: none;
    }

/*!
    WLS-Dropdown
*/
.wls-ui-dropdown-input {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid transparent;
    -weblit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    behavior: url(/inc/css/PIE.htc);
    padding-left: 1em;
    padding-right: 1em;
}

.wls-ui-dropdown-panel {
    display: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: inherit;
    padding: 1em;
    *padding: 1em 0;
    position: absolute;
    -webkit-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -ms-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -o-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    border: 1px solid #ccc\9;
}

    /*  fix IE7's padding bug */
    .wls-ui-dropdown-panel .wls-ui-tabs {
        *width: 90%;
        *margin: auto;
    }


/* 自選股分類設定 */
.wls-cate-setting {
    width: 250px;
    position: relative;
}


/*!
    WLS-自定義 Select 樣式
*/
.wls-ui-select {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: inherit;
    border: 1px solid transparent;
    padding: 4px 1em;
    background: url('/images/icon_downArrow.gif') no-repeat 95% center;
    cursor: pointer;
    -weblit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    behavior: url(/inc/css/PIE.htc);
}

.wls-ui-select-panel {
    display: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -ms-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    -o-box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 3px 10px 0px rgba(50, 50, 50, 0.5);
    border: 1px solid #ccc\9;
    width: inherit;
    padding: 1em;
    *padding: 1em 0;
    position: absolute;
    z-index: 99;
}

    .wls-ui-select-panel .select {
        list-style: none;
    }

        .wls-ui-select-panel .select > .option {
            padding: .3em 0;
        }

            .wls-ui-select-panel .select > .option > a {
                display: block;
                text-decoration: none;
                padding: .3em .5em;
                color: #333;
            }

                .wls-ui-select-panel .select > .option > a:hover {
                    background-color: #f2f2f2;
                }


/* 新增自選股分類 */
.wls-addItem-panel {
    margin: 0 auto 0;
    padding-top: 1em;
}

    .wls-addItem-panel > .wls-addItem-trigger {
        display: inline-block;
        *display: inline;
        *zoom: 1;
    }

    .wls-addItem-panel > .input-panel {
        display: none;
    }

        .wls-addItem-panel > .input-panel > input[type=text] {
            margin-top: 1em;
            padding: .2em .3em;
        }


/* 多階層選單 */
.wls-multiLevel-first {
    display: block;
}

.wls-multiLevel-second {
    display: none;
}

.wls-multiLevel-back-panel {
    display: none;
    margin: 0 auto;
    padding-top: 1em;
}

    .wls-multiLevel-back-panel > .wls-levelBack-trigger {
        display: inline-block;
        *display: inline;
        *zoom: 1;
    }



/* 視圖切換器 */
.wls-view-switcher {
    width: 80px;
    border: 1px solid transparent;
    -weblit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    behavior: url(/inc/css/PIE.htc);
}

    .wls-view-switcher > .item {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        background-color: papayawhip;
    }

        .wls-view-switcher > .item:first-child {
            border-right: 1px solid transparent;
        }

        .wls-view-switcher > .item:hover {
            background-color: #eee;
            color: #fff;
            -o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
            -webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
            -moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
            transition: color .20s linear, background-color .20s linear, border-color .20s linear;
        }

        .wls-view-switcher > .item > a {
            display: block;
            width: 100%;
            height: 100%;
            text-decoration: none;
            color: #ddd;
        }

    .wls-view-switcher > .active {
        background-color: #ddd;
    }

        .wls-view-switcher > .active > a,
        .wls-view-switcher > .active > a [class^="icon-"] {
            color: #fff;
            cursor: default;
        }

        .wls-view-switcher > .active:hover {
            background-color: #ddd;
        }


/* 垂直開闔 */
.wlsAccordion-item {
    width: 100%;
    border: 1px solid #f7cbd1;
    margin-bottom: .5em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    box-sizing: border-box;
    border-radius: 3px;
    padding: .5em 0 .5em 1em;
    background: #fff3f3;
    cursor: pointer;
}

    .wlsAccordion-item.hover {
        background-color: #f8e6e8;
    }

    .wlsAccordion-item.open {
        background-color: #fbf0f1;
        -webkit-box-shadow: 0px 0px 3px 2px rgba(150, 150, 150, 0.1);
        -moz-box-shadow: 0px 0px 3px 2px rgba(150, 150, 150, 0.1);
        box-shadow: 0px 0px 3px 2px rgba(150, 150, 150, 0.1);
        cursor: default;
    }

    .wlsAccordion-item .title {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        font-weight: bold;
    }

    .wlsAccordion-item .toggle {
        color: #E86363;
        text-decoration: none;
    }

    .wlsAccordion-item .date {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        color: #777;
    }

    .wlsAccordion-item .content {
        display: none;
        border-top: 0px solid #f6d9dd;
        padding: .5em 1.5em;
        margin-top: .5em;
    }

    .wlsAccordion-item.open .content {
        display: block;
    }