﻿/*@font-face {
    font-family: "FontAwesome";
    src: url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0);
    src: url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0) format("embedded-opentype"), url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0) format("woff2"), url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0) format("woff"), url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0) format("truetype"), url(css/font-awesome-4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular) format("svg");
    font-weight: normal;
    font-style: normal
}*/
.page-left {
    padding: 0;
    margin: 0;
    /*font-family: "Open sans", "微軟正黑體", "Microsoft JhengHei", Tahoma, Helvetica, "Microsoft Yahei", "微軟雅黑體", Arial, sans-serif;*/
    font-size: 15px;
    line-height: normal !important;
    color: #757575;
    font-weight: 300;
    min-height: auto !important;
}
/*.page-left h1,h2,h3,h4,h5,h6{
     font-family: "Open sans", "微軟正黑體", "Microsoft JhengHei", Tahoma, Helvetica, "Microsoft Yahei", "微軟雅黑體", Arial, sans-serif !important;
}*/
.section > div:first-child {
    margin-top: 20px;
    padding: 0 0 5px 0;
    overflow: hidden;
}


@media (min-width: 768px){
    .container {
        width: 740px;
    }
}
@media (min-width: 800px){
    .container {
        width: 98%;
    }
}
@media (min-width: 1240px){
    .container {
        width: 1220px;
    }
}
.section-header {
    float: left;
    font-size: 26px;
    font-weight: 500;
    color: #197cbc;
}
.section.video h1 {
    font-size: 20px;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 10px;
}
.uhk .recommendVideo > h2,
 .uhk .section.video h1,
.uhk .page-left a, .uhk .page-left h1  {
    /*color: #fff !important;*/
}

.uhk .page-left .section.video .program-list .title-uhk h2{
    color: #197cbc !important;
}
.uhk .recommendVideo > h2 {
    font-weight: bold;
     line-height: 20px;
    padding-left: 5px;
   
}
.uhk .card {
    border:  4px solid rgba(255,255,255,.15);
}
.uhk .card-header {
                        background-color: rgba(255, 255, 255, 0)!important;
                        /*padding-top: 20px!important;*/
border:  none;
                    }
                    .uhk .section.video .card.new-highlight{
                       /* border:  none!important;*/
                    }
                    .uhk .section.video .card.new-highlight .card-header {
                        background-color: rgba(255, 255, 255, 0)!important;
                        border:  none;
                    }
                    
                    .uhk .section.video .card.new-highlight {                  
                        border:  none;
                    }
                   .uhk .section.video .card.new-highlight h2{        
                        font-weight: bold;
                        line-height: normal;
                        min-height: auto;
                        font-size: 24px;
                        height: auto;
                        padding-top: 20px;
                    }
                    .uhk .section.video .card.new-highlight .card-detail {
                        padding: 0px!important;
                        border-top: none;
                    }
                    .uhk .card-detail-wrapper {
                          border-top: none;
                    }
                    
                    .uhk .page-left .section.video .program-list .title-uhk h2 {
                        display: inline-block !important;
                        font-size: 26px;
                        font-weight: bold;
                        line-height: 40px;
                    }
                    .uhk .section-header {
                        height: auto;
                    }
                    .uhk .program-list {
                        margin-top: 10px;
                    }
                    @media (max-width: 767px) and (min-width: 321px) {
                  
                            .section.video .moreItem button {
   /* background: #197cbc!important;
    color: #fff!important;*/
    margin-top: 10px;
    margin-bottom: 10px;
    margin: auto;
    display: block;
    color: #333;
    width: 100%;
    background: #FFF;
    max-width: 300px;
    margin: 0;
    padding: 10px 0;
    display: inline;
    }
                        
                        
                        
                         .mobile-list {
                            display: table;
                            width: 100%;
                        }
                        .section.video .card.mobile-list > a {
                            width: 100%;
                            /* display: inline-block; */
                            float: left;
                            display: table-cell;
                        }
                        .section.video .card.mobile-list > .card-header {
                            width: 60%;
                            display: inline-block;
                             display: table-cell;
                            vertical-align: top;
                        }
                        .uhk .section.video .card.new-highlight .card-detail {
                            padding: 5px!important;
                            border-top: none;
                            width: 95%;
                        }
                        
                        .uhk .section.video .card.new-highlight .col-sm-5 {
                           flex: 0 0 100%!important;
                            max-width: 100%!important;
                            /*margin: -15px;*/
                        }
                        .uhk .section.video .card.new-highlight .col-xs-12 {
                            
                        }
                   
                        .uhk .section.video .card.new-highlight .col-sm-7 {
                                /*flex: 0 0 100%!important;
                                max-width: 100%!important;
                                margin: -15px;*/
                        }
                        .uhk .container,
                        .uhk .row {
                            margin-left: 0px;
                            margin-right: 0px;
                            padding-left: 0px;
                            padding-right: 0px;
                        }
                        .uhk .section.video .card.new-highlight .col-sm-7 {
                            flex: 0 0 100%;
                            max-width: 100%;
                        }
                        .uhk .section.video .card.new-highlight .card-header {
                             width: 100%;
                        }
                        .uhk .moreVideo a {
                            background: #197cbc!important;
                            color: #fff!important;
                        }
                        .section.video .border-split-list {
                            border-top: 1px solid #ccc;
                            margin: 0px;
                            display: inline-block;
                            width: 100%;
                            position: absolute;
                            left: 0;
                        }
                        
                        .uhk .program-list .col-xs-12 {
                            width: 100%;
                        }
                        .col-sm-3 {
                              flex: 1 100%;

                            max-width: 100%;
                        }
                            .section.video .card.new-highlight .card-header h2 {
                                padding-top: 0px!important;
                        }
                        .section.video .program-list .title-hk h2 {
                              color: #197cbc!important;
                        }
                    }

                    
                    @media (max-width: 766px){
                       
                    }
                    

                    @media (min-width: 769px){
                    .section.video .detail {
                         width: auto; 
                    }
                    }

                    @media (max-width: 440px){
                    .section.video .right.share-icon {
                        float: none!important;
                    }   
                    }

                    .uhk .program-list .card-header {
                        padding-top: 0px!important;
                         border: none;
                    }

                    .uhk .program-list .infinite-item .card-detail {
                        display: none;
                    }

                    .uhk .program-list .card {
                        border: border:  4px solid rgba(255,255,255,.15);
                    }
                    .section.video .card .puhklished {
                        font-size: 12px;
                    }

.uhk .program-list .card-detail-wrapper {
    display: none;
}

@media only screen and (min-width: 576px){
    #global-menu .logo img {
            display: inline;
    }
}

.uhk .program-list .content .card {
    border: none!important;
    margin: 7px;
    
    
}

.uhk .program-list .card-header{
    padding: 5px 5px 15px 5px !important;
      /* border-bottom: 1px solid rgba(0, 0, 0, .125);*/
}
.uhk .program-list .border.uhk {
    background: #197cbc;
    border: 0px!important;
}

@media (max-width: 440px) {
    .section.video .mobile-shareBtn {
        display: none;
        width: 100%;
        text-align: center;
        position: fixed;
        background: rgba(0, 0, 0, 0.6);
        transition: all .15s ease-out;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        height: 100%;
        z-index: 99;
    }
    .section.video .card.new-highlight .card-header {
        margin-left: 0px!important;
    }
    .section.video .card.new-highlight .card-header h2 {
            padding-top: 0px!important;
    }
    

    
}

.show {
    display: block!important;
}



.title-uhk {
    border-bottom: 4px solid #197cbc;
}
.title-uhk {
   /* display: inline-block;*/
}

.video.latest .card {
        border: 1px solid #eee!important;
}

.modal-backdrop.show {
    opacity: .5!important;
}

#album-popup .modal-header {
    display: block;
    width: 100%;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    border-bottom: 0px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

#album-popup .modal-header .close {
    padding: 8px;
    margin: -8px;
    color: #fff;
    text-shadow: 0 0 0 transparent;
    opacity: 1;
}

.modal.show .modal-dialog {
    transform: translate(0,0);
}

  .section.video .program-list .title-hk h2 {
    color: #197cbc !important;
      font-weight: bold;
    font-size: 16px !important;
    padding-top: 15px;
  }

.content .card h2 {
    height: 40px;
    overflow: hidden;
    color: #197cbc !important;
     font-weight: 500;
}

.section.video div.border {
    background:#197cbc;
}
.video-js {
    display: inline-block;
    width: 100%;
}
.video-js .vjs-big-play-button {
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%, -50%);
}

#album-popup .modal-content.video {
    width: auto;
}

#album-popup .modal-content.video .player {
    visibility: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    }
.section.video .program-list .title-hk h1 {
    margin: 0;
     color: #197cbc !important;
    font-size: 28px;
    display: inline;
    font-weight: 500;
    line-height: inherit
}
.section.video .program-list .title-hk h2 {
    color: #197cbc !important;
    font-size: 26px!important;
}

.video-js.my-video-dimensions {
    min-height: 555px;
    margin: 0!important;
}

@media (max-width: 768px){
    .video-js.my-video-dimensions {
    min-height: auto!important;
    }
    
    .section.video .card.new-highlight {
    margin-bottom: 0px;
    }
    

    .section.video .moreItem button:after {
    display: none;
}
}

.section.video .card.mobile-list > div {
    position: relative;
}


.card:hover > div img {
  /*width: 110%;
    height:110%;*/
  /*transition: all .15s ease-in;
  opacity: .9;
  width: 104% !important;*/
}
.section.video .moreItem button {
   /* text-align: center;*/
    /*background: #197cbc;*/
    font-size: 16px;
}


.section.video .content {
    padding-bottom: 0px;
}
.item-detail-ttl {
    padding-bottom: 10px;
    font-size: 22px;
    font-weight: 700;
}