﻿.box {
    margin-bottom: 10px;
    position: relative;
}

    .box.box-collapsed .box-header .actions .box-collapse i:before {
        content: "\f078";
    }

    .box.box-collapsed .box-content {
        display: none;
    }

    .box .box-header {
        font-size: 18px;
        font-weight: 200;
        /*line-height: 20px;*/
        line-height: 32px;
        padding: 10px 15px;
        overflow: hidden;
        /*zoom: 1;*/
    }

        .box .box-header.contrast-background {
            color: white;
        }

            .box .box-header.contrast-background .title {
                color: white;
            }

            .box .box-header.contrast-background .actions .btn-link {
                color: white;
            }

                .box .box-header.contrast-background .actions .btn-link:hover {
                    color: #f34541 !important;
                    background-color: white;
                }

        .box .box-header.orange-background {
            color: white;
        }

            .box .box-header.orange-background .title {
                color: white;
            }

            .box .box-header.orange-background .actions .btn-link {
                color: white;
            }

                .box .box-header.orange-background .actions .btn-link:hover {
                    color: #f8a326 !important;
                    background-color: white;
                }

        .box .box-header.blue-background {
            color: white;
        }

            .box .box-header.blue-background .title {
                color: white;
            }

            .box .box-header.blue-background .actions .btn-link {
                color: white;
            }

                .box .box-header.blue-background .actions .btn-link:hover {
                    color: #00acec !important;
                    background-color: white;
                }

        .box .box-header.purple-background {
            color: white;
        }

            .box .box-header.purple-background .title {
                color: white;
            }

            .box .box-header.purple-background .actions .btn-link {
                color: white;
            }

                .box .box-header.purple-background .actions .btn-link:hover {
                    color: #9564e2 !important;
                    background-color: white;
                }

        .box .box-header.green-background {
            color: white;
        }

            .box .box-header.green-background .title {
                color: white;
            }

            .box .box-header.green-background .actions .btn-link {
                color: white;
            }

                .box .box-header.green-background .actions .btn-link:hover {
                    color: #49bf67 !important;
                    background-color: white;
                }

        .box .box-header.red-background {
            color: white;
        }

            .box .box-header.red-background .title {
                color: white;
            }

            .box .box-header.red-background .actions .btn-link {
                color: white;
            }

                .box .box-header.red-background .actions .btn-link:hover {
                    color: #f34541 !important;
                    background-color: white;
                }

        .box .box-header.muted-background {
            color: white;
        }

            .box .box-header.muted-background .title {
                color: white;
            }

            .box .box-header.muted-background .actions .btn-link {
                color: white;
            }

                .box .box-header.muted-background .actions .btn-link:hover {
                    color: #999999 !important;
                    background-color: white;
                }

        .box .box-header.fb-background {
            color: white;
        }

            .box .box-header.fb-background .title {
                color: white;
            }

            .box .box-header.fb-background .actions .btn-link {
                color: white;
            }

                .box .box-header.fb-background .actions .btn-link:hover {
                    color: #3d579d !important;
                    background-color: white;
                }

        .box .box-header.dark-background {
            color: white;
        }

            .box .box-header.dark-background .title {
                color: white;
            }

            .box .box-header.dark-background .actions .btn-link {
                color: white;
            }

                .box .box-header.dark-background .actions .btn-link:hover {
                    color: #2b2d30 !important;
                    background-color: white;
                }

        .box .box-header.pink-background {
            color: white;
        }

            .box .box-header.pink-background .title {
                color: white;
            }

            .box .box-header.pink-background .actions .btn-link {
                color: white;
            }

                .box .box-header.pink-background .actions .btn-link:hover {
                    color: #c44a83 !important;
                    background-color: white;
                }

        .box .box-header.grass-green-background {
            color: white;
        }

            .box .box-header.grass-green-background .title {
                color: white;
            }

            .box .box-header.grass-green-background .actions .btn-link {
                color: white;
            }

                .box .box-header.grass-green-background .actions .btn-link:hover {
                    color: #5daf2b !important;
                    background-color: white;
                }

        .box .box-header.sea-blue-background {
            color: white;
        }

            .box .box-header.sea-blue-background .title {
                color: white;
            }

            .box .box-header.sea-blue-background .actions .btn-link {
                color: white;
            }

                .box .box-header.sea-blue-background .actions .btn-link:hover {
                    color: #0163ac !important;
                    background-color: white;
                }

        .box .box-header.banana-background {
            color: white;
        }

            .box .box-header.banana-background .title {
                color: white;
            }

            .box .box-header.banana-background .actions .btn-link {
                color: white;
            }

                .box .box-header.banana-background .actions .btn-link:hover {
                    color: #fcd052 !important;
                    background-color: white;
                }

        .box .box-header.dark-orange-background {
            color: white;
        }

            .box .box-header.dark-orange-background .title {
                color: white;
            }

            .box .box-header.dark-orange-background .actions .btn-link {
                color: white;
            }

                .box .box-header.dark-orange-background .actions .btn-link:hover {
                    color: #f56e00 !important;
                    background-color: white;
                }

        .box .box-header.brown-background {
            color: white;
        }

            .box .box-header.brown-background .title {
                color: white;
            }

            .box .box-header.brown-background .actions .btn-link {
                color: white;
            }

                .box .box-header.brown-background .actions .btn-link:hover {
                    color: #924e31 !important;
                    background-color: white;
                }

        .box .box-header .title {
            float: left;
            color: #3c3c3c;
        }

        .box .box-header .actions {
            margin-top: -3px;
            float: right;
        }

            .box .box-header .actions .dropdown-toggle {
                position: relative;
                top: 5px;
            }

            .box .box-header .actions .btn-link {
                color: #c4c4c4;
                text-decoration: none;
                text-shadow: none;
            }

                .box .box-header .actions .btn-link:hover {
                    color: #f34541;
                }

            .box .box-header .actions .box-collapse i {
                font-family: FontAwesome;
                font-weight: normal;
                font-style: normal;
                text-decoration: inherit;
                -webkit-font-smoothing: antialiased;
                display: inline;
                width: auto;
                height: auto;
                line-height: normal;
                vertical-align: baseline;
                background-image: none;
                background-position: 0% 0%;
                background-repeat: repeat;
                margin-top: 0;
            }

                .box .box-header .actions .box-collapse i:before {
                    content: "\f077";
                }

        .box .box-header.box-header-small {
            font-size: 14px;
            font-weight: 200;
            line-height: 19px;
            padding: 10px 10px;
        }

            .box .box-header.box-header-small .actions {
                margin-top: -1px;
            }

    .box .box-content {
        padding: 10px;
        border: 1px solid #dddddd;
        background: white;
        display: block;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
        -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
    }

        .box .box-content .box-toolbox {
            overflow: hidden;
            /*zoom: 1;*/
            background-color: #f4f4f4;
            padding: 5px;
        }

            .box .box-content .box-toolbox.box-toolbox-top {
                margin: -10px -10px 10px -10px;
                border-bottom: 1px solid #dddddd;
            }

            .box .box-content .box-toolbox.box-toolbox-bottom {
                margin: 10px -10px -10px -10px;
                border-top: 1px solid #dddddd;
            }

        .box .box-content.box-no-padding {
            padding: 0;
        }

            .box .box-content.box-no-padding form {
                margin-bottom: 0;
            }

        .box .box-content.box-padding {
            padding: 20px;
        }

            .box .box-content.box-padding .box-toolbox {
                padding: 10px;
                position: relative;
            }

                .box .box-content.box-padding .box-toolbox.box-toolbox-top {
                    margin: -20px -20px 20px -20px;
                }

                .box .box-content.box-padding .box-toolbox.box-toolbox-bottom {
                    margin: 20px -20px -20px -20px;
                }

        .box .box-content.box-double-padding {
            padding: 40px;
        }

            .box .box-content.box-double-padding .box-toolbox {
                padding: 20px;
            }

                .box .box-content.box-double-padding .box-toolbox.box-toolbox-top {
                    margin: -40px -40px 40px -40px;
                }

                .box .box-content.box-double-padding .box-toolbox.box-toolbox-bottom {
                    margin: 40px -40px -40px -40px;
                }

    .box.box-transparent {
        background: none;
        padding: 0;
        border: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

        .box.box-transparent .box-content {
            background: transparent;
            border: none;
            border-top: 1px solid #dddddd;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
        }

    .box.box-bordered {
        border-style: solid;
        border-width: 2px;
        border-color: #dddddd;
    }

        .box.box-bordered .box-content {
            border-left: none;
            border-right: none;
            border-bottom: none;
        }

.box-quick-link {
    text-align: center;
    margin-bottom: 10px;
}

    .box-quick-link a {
        text-decoration: none;
    }

        .box-quick-link a .header {
            height: 60px;
            line-height: 60px;
            padding-bottom: 2px;
        }

            .box-quick-link a .header [class^="icon-"], .box-quick-link a .header [class*=" icon-"] {
                color: white;
                font-size: 30px;
                vertical-align: middle;
            }

        .box-quick-link a .content {
            text-transform: uppercase;
            font-size: 85%;
            white-space: nowrap;
            overflow: hidden;
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            color: #5b5b5b;
            background-color: #dbdbdb;
            border-bottom: 1px solid #cecece;
            padding: 5px;
        }

        .box-quick-link a:hover .header [class^="icon-"], .box-quick-link a:hover .header [class*=" icon-"] {
            font-size: 40px;
        }

        .box-quick-link a:hover .content {
            text-decoration: underline;
            border-bottom-color: #c1c1c1;
            background-color: #cecece;
        }

    .box-quick-link.contrast-background a:active .header {
        background: #f01611;
    }

    .box-quick-link.contrast-background:hover .header {
        background: #f12e29;
    }

    .box-quick-link.orange-background a:active .header {
        background: #e48a07;
    }

    .box-quick-link.orange-background:hover .header {
        background: #f7990d;
    }

    .box-quick-link.blue-background a:active .header {
        background: #0087b9;
    }

    .box-quick-link.blue-background:hover .header {
        background: #0099d3;
    }

    .box-quick-link.purple-background a:active .header {
        background: #7839da;
    }

    .box-quick-link.purple-background:hover .header {
        background: #864fde;
    }

    .box-quick-link.green-background a:active .header {
        background: #379e51;
    }

    .box-quick-link.green-background:hover .header {
        background: #3eb05b;
    }

    .box-quick-link.red-background a:active .header {
        background: #f01611;
    }

    .box-quick-link.red-background:hover .header {
        background: #f12e29;
    }

    .box-quick-link.muted-background a:active .header {
        background: gray;
    }

    .box-quick-link.muted-background:hover .header {
        background: #8c8c8c;
    }

    .box-quick-link.fb-background a:active .header {
        background: #2f4378;
    }

    .box-quick-link.fb-background:hover .header {
        background: #364d8b;
    }

    .box-quick-link.dark-background a:active .header {
        background: #131415;
    }

    .box-quick-link.dark-background:hover .header {
        background: #1f2023;
    }

    .box-quick-link.pink-background a:active .header {
        background: #a5366a;
    }

    .box-quick-link.pink-background:hover .header {
        background: #b83c76;
    }

    .box-quick-link.grass-green-background a:active .header {
        background: #478621;
    }

    .box-quick-link.grass-green-background:hover .header {
        background: #529b26;
    }

    .box-quick-link.sea-blue-background a:active .header {
        background: #014679;
    }

    .box-quick-link.sea-blue-background:hover .header {
        background: #015493;
    }

    .box-quick-link.banana-background a:active .header {
        background: #fbc220;
    }

    .box-quick-link.banana-background:hover .header {
        background: #fcc939;
    }

    .box-quick-link.dark-orange-background a:active .header {
        background: #c25700;
    }

    .box-quick-link.dark-orange-background:hover .header {
        background: #dc6300;
    }

    .box-quick-link.brown-background a:active .header {
        background: #6c3a24;
    }

    .box-quick-link.brown-background:hover .header {
        background: #7f442b;
    }

.box-statistic {
    background-color: white;
    margin-bottom: 5px;
    padding: 5px 10px;
    position: relative;
}

    .box-statistic .title {
        margin: 0;
        line-height: 28px;
    }

    .box-statistic small {
        text-transform: uppercase;
    }

    .box-statistic [class*="icon-"] {
        font-size: 30px;
        top: 13px;
    }

        .box-statistic [class*="icon-"].align-left {
            position: absolute;
            left: 10px;
        }

        .box-statistic [class*="icon-"].align-right {
            position: absolute;
            right: 10px;
        }

    .box-statistic.contrast-background .title, .box-statistic.contrast-background small, .box-statistic.contrast-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.contrast-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.orange-background .title, .box-statistic.orange-background small, .box-statistic.orange-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.orange-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.blue-background .title, .box-statistic.blue-background small, .box-statistic.blue-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.blue-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.purple-background .title, .box-statistic.purple-background small, .box-statistic.purple-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.purple-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.green-background .title, .box-statistic.green-background small, .box-statistic.green-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.green-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.red-background .title, .box-statistic.red-background small, .box-statistic.red-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.red-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.muted-background .title, .box-statistic.muted-background small, .box-statistic.muted-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.muted-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.fb-background .title, .box-statistic.fb-background small, .box-statistic.fb-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.fb-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.dark-background .title, .box-statistic.dark-background small, .box-statistic.dark-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.dark-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.pink-background .title, .box-statistic.pink-background small, .box-statistic.pink-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.pink-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.grass-green-background .title, .box-statistic.grass-green-background small, .box-statistic.grass-green-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.grass-green-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.sea-blue-background .title, .box-statistic.sea-blue-background small, .box-statistic.sea-blue-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.sea-blue-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.banana-background .title, .box-statistic.banana-background small, .box-statistic.banana-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.banana-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.dark-orange-background .title, .box-statistic.dark-orange-background small, .box-statistic.dark-orange-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.dark-orange-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic.brown-background .title, .box-statistic.brown-background small, .box-statistic.brown-background [class*="icon-"] {
        color: white !important;
    }

    .box-statistic.brown-background small {
        /*filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);*/
        opacity: 0.7;
    }

    .box-statistic:hover [class*="icon-"].align-right {
        right: 15px;
        -webkit-transition: right 0.1s linear;
        -moz-transition: right 0.1s linear;
        -o-transition: right 0.1s linear;
        transition: right 0.1s linear;
    }

    .box-statistic:hover [class*="icon-"].align-left {
        left: 15px;
        -webkit-transition: left 0.1s linear;
        -moz-transition: left 0.1s linear;
        -o-transition: left 0.1s linear;
        transition: left 0.1s linear;
    }

.responsive-table {
    position: relative;
    overflow: hidden;
}

    .responsive-table .scrollable-area {
        width: 100%;
        overflow: scroll;
        overflow-y: hidden;
    }

    .responsive-table table td {
        position: relative;
        white-space: nowrap;
        overflow: hidden;
    }



.box-content.box-no-padding .table-striped th:first-child, .box-content.box-no-padding .table-striped td:first-child {
    border-left: none;
}

.box-content.box-no-padding .table-striped th:last-child, .box-content.box-no-padding .table-striped td:last-child {
    border-right: none;
}


.box.box-collapesed .box-content {
    display: none;
}




.box-slategrey-background {
    background-color: lightslategrey;
}
.box .box-header.box-slategrey-background .title {
    color: white;
}

.box .box-header.box-slategrey-background .actions .btn-link {
    color: white;
}

.box .box-header.box-slategrey-background .actions .btn-link:hover {
    background-color: white;
    color: lightslategrey;
}



.box-tomato-background {
    background-color: tomato;
}

.box .box-header.box-tomato-background .title {
    color: white;
}

.box .box-header.box-tomato-background .actions .btn-link {
    color: white;
}

    .box .box-header.box-tomato-background .actions .btn-link:hover {
        background-color: white;
        color: tomato;
    }


.box-fengshui-background {
    /*background-color: #0070C0;*/
    background-color: #FC6C85;
}

.box .box-header.box-fengshui-background .title {
    color: white;
}

.box .box-header.box-fengshui-background .actions .btn-link {
    color: white;
}

    .box .box-header.box-fengshui-background .actions .btn-link:hover {
        background-color: white;
        color: #0070C0;
    }



.box-fengshui-light-background {
    /*background-color: #00B0F0;*/
    background-color: #FAAFBA;
}

.box .box-header.box-fengshui-light-background .title {
    /*color: white;*/
    color: brown;
}

.box .box-header.box-fengshui-light-background .actions .btn-link {
    color: white;
}

    .box .box-header.box-fengshui-light-background .actions .btn-link:hover {
        background-color: white;
        color: #00B0F0;
    }


.dx-button.qimen_chart_btn_selected_fengshui {
    background-color: #FAAFBA;
    border-color: #FC6C85;
    color: brown;
}

#displaySvg_flyingstar1_controller .dx-button,
#displaySvg_flyingstar2_controller .dx-button,
#displaySvg_flyingstar1_axis_controller .dx-button,
#displaySvg_flyingstar2_axis_controller .dx-button,
#displaySvg_flyingstar1_align .dx-button,
#displaySvg_flyingstar2_align .dx-button,
#displaySvg_qimenfengshui1_axis_facing_controller .dx-button,
#displaySvg_qimenfengshui2_axis_facing_controller .dx-button,
#displaySvg_qimenfengshui1_axis_door_controller .dx-button,
#displaySvg_qimenfengshui2_axis_door_controller .dx-button,
#displaySvg_qimenfengshui1_axis_controller .dx-button,
#displaySvg_qimenfengshui2_axis_controller .dx-button,
#displaySvg_qimenfengshui1_align .dx-button,
#displaySvg_qimenfengshui2_align .dx-button,
#displaySvg_XuanKong1_controller .dx-button,
#displaySvg_XuanKong1_axis_controller .dx-button,
#displaySvg_XuanKong1_time .dx-button,
#displaySvg_XuanKong1_align .dx-button,
#displaySvg_XuanKong2_controller .dx-button,
#displaySvg_XuanKong2_axis_controller .dx-button,
#displaySvg_XuanKong2_time .dx-button,
#displaySvg_XuanKong2_align .dx-button {
    /*border-color: #FAAFBA;*/
    border-color: #faafba8c;
    /*color: #E4287C;*/
    color: brown;
}






.box-green-background {
    background-color: #00bf40;
}

.box .box-header.box-green-background .title {
    color: white;
}

.box .box-header.box-green-background .actions .btn-link {
    color: white;
}

    .box .box-header.box-green-background .actions .btn-link:hover {
        background-color: white;
        color: #00bf40;
    }


[class^="icon-custom-"] {
    display: inline;
    width: auto;
    height: auto;
    line-height: normal;
    vertical-align: baseline;
    background-image: none;
    background-position: 0% 0%;
    background-repeat: repeat;
    margin-top: 0;
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
}

[class^="icon-custom-"]:before {
    text-decoration: inherit;
    display: inline-block;
    speak: none;
}

.icon-custom-edit:before {
    content: "\f044";
}

.icon-custom-remove:before {
    content: "\f00d";
}

.box .box-header .actions .box-collapse i:before {
    content: "\f077";
}

.box.box-collapesed .box-header .actions .box-collapse i:before {
    content: "\f078";
}











.box.outerBox .box-content {
    padding: 5px;
    padding-top: 10px;
}


.box.innerBox .box-content {
    padding: 10px;
}

@media screen and (min-width: 768px) {


}


@media screen and (min-width: 992px) {

    .box.innerBox .box-content {
        padding-top: 10px;
    }

    .box.outerBox .box-content {
        padding: 20px;
    }

}