/* RWD CASCADING STYLE SHEET */
/* MAIN CAROUSEL */
/* 2016 04 14 CREATED BY RTISTECH */

/* Mobile Device First */

#owl-HI .owl-item img{
    display: block;
    width: 100%;
    height: auto;
}

#owl-HI .owl-item .Header{
    padding: 30px 0;
    font-weight: 100;
    font-size: 2.8em;
}

#owl-HI .owl-item .Content{
    padding: 0;
    font-weight: 100;
    font-size: 1.2em;
}

#owl-HI .ItemContent{
    display: table;
    table-layout: fixed;
    width: 100%;

    background: url(../images/Carousel/HICarouselBG.png) no-repeat scroll center center #000;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index: -1;

}

#owl-HI { position: relative;}

.owl-theme .owl-controls { margin-top: -24px; }
.owl-theme .owl-controls .owl-buttons div {   
    opacity: 0;
    background:none;
    border:none;
    font-size: 0;
    position: absolute;
    top: 44.5%;
    z-index: 300;
    width: 50px;
    height: 50px; }
.owl-theme:hover .owl-controls .owl-buttons div { opacity: 1; }
.owl-theme .owl-controls .owl-buttons .owl-prev {  left: 10%; background: url(../images/Prev.png) no-repeat center center; }
.owl-theme .owl-controls .owl-buttons .owl-next { right: 10%; background: url(../images/Next.png) no-repeat center center; }
.owl-theme .owl-controls .owl-page span { background: #EEB033; }
.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span { opacity: .9; }

@media (min-width:971px) {
    .owl-theme:hover .owl-controls,.owl-pagination {visibility: visible;}
}
@media (max-width:970px) {
    .owl-theme:hover .owl-controls,.owl-pagination {visibility: hidden;}
}

/* Custom Style */
.owl-carousel-SecPaddingTop {
    width: 100%;
    padding-top: 50px;
}

@media only screen and (min-width: 768px) {
    .owl-carousel-SecPaddingTop  {
        padding-top: 70px;
        width: 100%;
    }
}

/* Carousel Height */
.owl-carousel .owl-item {
    height: auto;
    padding-bottom: 0;
}

/* 圖片位置與左右邊界 */
@media only screen and (min-width: 1171px) {
    #owl-HI .ItemContent{
        padding-left: 80px;
        padding-right: 80px;
        padding-bottom: 30px;
    }
}

@media only screen and (min-width: 971px) {
    #owl-HI .ItemContent{
        padding-left: 40px;
        padding-right: 40px;
        padding-bottom: 30px;
    }
}