/*Frontpage top carousel css begin*/
#myCarousel {
    margin: 1em 0em;
}

#myCarousel .carousel-caption {
    right: 3%;
    left: 55%;
    bottom: 5%;
    text-align: left;
    padding: 1em;
    background: rgba(146,144,144,0.57);
    color: white;
}

#myCarousel .carousel-caption h3 {
    color: white;
}

#myCarousel .carousel-caption h3.carousel-caption-title {
    font-size: 1.375em;
}

#myCarousel .carousel-control {
    background-image: none;
    color: white;
}

.carousel-inner>.item>a>img, .carousel-inner>.item>img {
    width: 100% /*when img is less then screen width*/
}

/*override content ol style*/
.carousel-indicators {
    margin-left: -30% !important;
}

/*override content li style set by base.css*/
#content .carousel-indicators li {
    display: inline-block;
}

@media (max-width: 993px) {
    #myCarousel .carousel-caption {
        position: static;
        background: rgba(102,102,102,0.75);
    }
    #myCarousel .carousel-caption h3 {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-top: 0;
        margin-bottom: 0;
        font-size: 14px;
    }
    #myCarousel .carousel-caption p {
        display: none;
    }
    .carousel-indicators {
        display: none;
    }
}

/*special layout for FP Carousel focus news overlay text*/
/* default positions for reference:
	lower left
        left: 3%;
        right: 53%;
    lower right
        left: 53%;
        right: 3%;    
*/
@media (min-width: 993px) {
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(4) .carousel-caption {
        left: 56%;
        right: 5%;   
        text-align: center;
        bottom: 3%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(2) .carousel-caption {
        left: 55%;
        right: 5%;   
        text-align: center;
        bottom: 5%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }    
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(3) .carousel-caption {
        left: 60%;
        right: 5%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 5%;
    }
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(1) .carousel-caption {
        left: 26%;
        right: 26%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 12%;
        text-align: center;
    }
    body.section-Front-Page-en #myCarousel div.carousel-inner div.item:nth-child(1) .carousel-caption {
        left: 60%;
        right: 10%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 5%;
    }
    body.section-Front-Page-en #myCarousel div.carousel-inner div.item:nth-child(4) .carousel-caption {
        left: 25%;
        right: 25%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 12%;
        text-align: center;
    }
    body.section-Front-Page-en #myCarousel div.carousel-inner div.item:nth-child(3) .carousel-caption {
        left: 53%;
        right: 3%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 5%;
    }
    body.section-Front-Page-en #myCarousel div.carousel-inner div.item:nth-child(2) .carousel-caption {
        left: 56%;
        right: 5%;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        bottom: 3%;
    }
/* subtitle styles
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(1) .carousel-caption h3.carousel-caption-title {font-size:20px;}
    body.section-Front-Page-zh #myCarousel div.carousel-inner div.item:nth-child(1) .carousel-caption h3.carousel-caption-subtitle {font-size:20px; margin-top:0px; text-align:right}
*/
    body.section-Front-Page-en #myCarousel div.carousel-inner div.item:nth-child(1) .carousel-caption h3.carousel-caption-subtitle {margin-top:0px;}
}
/*Frontpage top carousel css end*/