* {
    font-family: 'Microsoft JhengHei','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

body {
    /*background-image: linear-gradient(to bottom,#222 0,#3c3c3c 100%);*/
}

.setnLogo {
    height: 25px;
}

.UserInfo {
    font-size: 12px;
}

.nav > .dropdown > a > img {
    max-height: 16px;
    margin-right: 3px;
}

.dropdown > a::after {
    content: '|';
    margin-left: 13px;
    color: #666;
    display: inline-block;
    position: absolute;
    right: 0;
}

.dropdown:last-child > a::after {
    content: '';
}

footer {
    color: #FFFFFF;
    background-color: #120523;
    background-image: -webkit-linear-gradient(top, #0d0015 0, #10001a 100%);
    background-image: -o-linear-gradient(top, #0d0015 0, #10001a 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0d0015), to(#10001a));
    background-image: linear-gradient(to bottom, #0d0015 0, #10001a 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0d0015', endColorstr='#10001a', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

    footer a {
        color: #FFFFFF;
    }

        footer a:hover {
            color: #ee7800;
        }

    footer > div {
        padding: 5px 0;
    }

.onlineInfo {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-content: space-around;
    align-content: space-around;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .onlineInfo > div {
        padding: 0 10px;
    }


.copyright {
    text-align: center;
    font-size: 0.938em;
    color: #fff;
}

.RelatedLinks {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-content: space-around;
    align-content: space-around;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: left;
}

    .RelatedLinks > div {
        margin: 5px 0;
    }

        .RelatedLinks > div::before {
            content: "．";
        }

/* uc  區塊 及內容 table */
.uc-container {
    width: 100%;
    margin: 0 auto 1em auto;
}

.uc-area {
    width: 100%;
    border: 1px solid #aaaaaa;
    border-top: 0;
    max-height: 500px;
    overflow: auto;
    margin-bottom: 10px;
    padding: 3px 1px;
}

.ui-tabs .ui-tabs-panel {
    padding: 1em 0.5em;
}

.uc-title {
    background-color: #c24242;
    margin: 0.125em auto 0 auto;
    padding: 5px 0;
    text-align: center;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 1.25em;
    color: #ffffff;
}

.uc-area .uc-table {
    table-layout: fixed;
    font-size: 14px;
    font-size: 1.4rem;
    max-height: 400px;
}

    .uc-area .uc-table > thead > tr > th {
        background-color: #94d2ff;
        font-weight: bold;
        border: 1px dotted #0094ff;
        color: #333333;
    }

    .uc-area .uc-table > tbody > tr > td {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 5px 3px;
    }

        .uc-area .uc-table > thead > tr > th:not(:first-child), .uc-area .uc-table > tbody > tr > td:not(:first-child) {
            text-align: center;
            width: 55px;
        }

    .uc-area .uc-table > tbody > tr:nth-child(odd) {
        background-color: #ddd;
    }

.blockMore {
    width: 100%;
    text-align: right;
}

.siderbarTip {
    font-size: 0.875em;
}

.bannerBlock {
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
}

    .bannerBlock .bannerItem {
        width: 49%;
        margin: 5px auto;
        -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
        -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
        box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    }


.BPMBlock {
    position: relative;
}

.bpmRefresh {
    position: absolute;
    right: 10px;
    top: 10px;
}

.FormLay {
    width: 96%;
    margin: auto;
}

    .FormLay ul {
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-content: space-around;
        align-content: space-around;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        list-style-type: none;
        padding: 0;
    }

        .FormLay ul li {
            padding: 5px 0;
            width: 50%;
        }

/*最新活動輪播設定 Start*/
#ActiveEvent .carousel-caption h3 {
    color: #f4511e;
    font-weight: 600;
}

#ActiveEvent img, #ActiveEvent img {
    margin: auto;
    height: 280px;
}

#ActiveEvent .carousel-control.right, .carousel-control.left {
    background-image: none;
    color: #f4511e;
}

#ActiveEvent .carousel-indicators li {
    border-color: #f4511e;
}

    #ActiveEvent .carousel-indicators li.active {
        background-color: #f4511e;
    }
/*最新活動輪播設定 End*/

.ExtBlock {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-content: space-around;
    align-content: space-around;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

    .ExtBlock div:first-child {
        -webkit-flex: 1;
        flex: 1;
    }

        .ExtBlock div:first-child > input[type="text"] {
            width: 40%;
            max-width: 150px;
        }

    .ExtBlock div:last-child {
        width: 60px;
        margin: auto 5px;
    }

/*卡鐘資料區塊設定 Start*/
.PunchClock {
    font-size: 0.938em;
    border: 1px solid #98bf21;
}

    .PunchClock > thead > tr > th,
    .PunchClock > tbody > tr > th,
    .PunchClock > tfoot > tr > th,
    .PunchClock > thead > tr > td,
    .PunchClock > tbody > tr > td,
    .PunchClock > tfoot > tr > td {
        border: 1px solid #98bf21;
    }
/*卡鐘資料區塊設定 End*/

#myTabContent table > thead > tr > th:first-child, #myTabContent table > tbody > tr > td:first-child {
    width: 70px;
    text-align: center;
}

#myTabContent table > thead > tr > th:last-child, #myTabContent table > tbody > tr > td:last-child {
    width: calc(100% - 70px);
}




.CurYearLink {
    width: 100%;
    font-size: 10px;
    display: inline-block;
    padding: 5px;
    text-decoration: none;
}

    .CurYearLink:hover {
        text-decoration: none;
    }

/*modal 影音*/
#video_view .modal-header h5.modal-title {
    font-size: 20px;
    display: inline;
    font-weight: bold;
}

@media (min-width: 1200px) {
    .onlineInfo, .RelatedLinks {
        -webkit-justify-content: center;
        justify-content: center;
    }

    #myTabContent > div {
        height: 250px;
        overflow: auto;
    }
}

@media (min-width: 980px) and (max-width: 1199px) {
    .onlineInfo, .RelatedLinks {
        -webkit-justify-content: center;
        justify-content: center;
    }

    .bannerBlock .bannerItem {
        width: 100%;
        height: 50%;
        max-height: 75px;
        overflow: hidden;
    }

        .bannerBlock .bannerItem.bannerBPM img {
            margin-top: -25px;
        }

        .bannerBlock .bannerItem.banner159 img {
            margin-top: -7px;
        }

        .bannerBlock .bannerItem.bannerKM img {
            margin-top: -30px;
        }

        .bannerBlock .bannerItem.bannerFeedback img {
            margin-top: -44px;
        }
}

@media (min-width: 768px) and (max-width: 979px) {
    .RelatedLinks > div {
        width: 25%;
    }

    .onlineInfo > div {
        -webkit-flex: 1 50%;
        flex: 1 50%;
    }

    #ActiveEvent img, #ActiveEvent img {
        height: 180px;
    }
}

@media (max-width: 767px) {

    .RelatedLinks > div {
        width: 33%;
    }

    .onlineInfo > div {
        -webkit-flex: 1 50%;
        flex: 1 50%;
    }

    .blockMore img {
        height: 22px;
    }

    .bannerBlock .bannerItem {
        width: 24%;
    }
}

@media (max-width: 480px) {
    .carousel-inner > .item > img,
    .carousel-inner > .item > a > img {
        height: 300px;
    }

    .RelatedLinks > div:nth-child(odd) {
        width: 45%;
    }

    .RelatedLinks > div:nth-child(even) {
        -webkit-flex: 1 55%;
        flex: 1 55%;
    }

    .bannerBlock .bannerItem {
        width: 49%;
    }
}