/* this was combined css of  developer css*/
/* original files are here IT_Documents/Development/www.efchina.org/website_1_V1.0_en/style */
/*Ê×Ò³½¹µãͼ start*/
.focus1 {
    margin:1em auto 0em auto;
}

@media (min-width:1300px) {
    .focus1>.hd>ul {
        height: 125px; /*give static height after 1300*/
    }
}
@media (max-width:1299px) {
    .focus1>.hd>ul {
        height: 9.5vw; /*reserve space for the hover inidcator bar by making ul tall enough, otherwise when it's shown, lower elements shift down*/
    }
}

.focus1 .hd li {
    float:left;
    width:13%;
    margin-right:1.5%;
    text-align:center;
    margin-bottom: -25px;
    height: 90%; /*make some space between image and hover inidcator bar, height of li should be taller than img+span for bar to display below li. formula to calculate height is li_wideth*.9-25(span height)*/
}

.focus1 .hd img {
    width:100%;
}

.focus1 .hd li span {
    background: url(images-ieco/gray_bg_80.png) repeat;
    display: block;
    position: absolute;
    color: #fff;
    font-size: 0.92em;
    line-height: 13px;
    height: 33px;
    padding-top: 11px;
    vertical-align: bottom;
    position: relative;
    bottom: 32px;
}
.focus1 .hd li:nth-child(1) span {
}
.focus1 .hd li:nth-child(2) span {
    padding-top: 5px;
}
.focus1 .hd li:nth-child(3) span {
}
.focus1 .hd li:nth-child(4) span {
    padding-top: 5px;
}
.focus1 .hd li:nth-child(5) span {
}
.focus1 .hd li:nth-child(6) span {
}
.focus1 .hd li:nth-child(7) span {
    padding-top: 5px;
}

@media (max-width: 993px) {
    .focus1 .hd li span { 
        font-size: 1.4vw;
    }
}

.focus1 .bd {
    width: 100%;
    margin: 0;
    padding: 0;
}

.focus1 .hd {
    background-color: transparent;
    padding: 0;
}

.focus1 .hd li:hover {
    /*transform: scale(1.1);*/
    border-bottom:5px solid #0d627d;
}

.focus1 .hd li:last-child {
    margin-right: 0;
}

@media (max-width: 767px) {
    .focus1 .hd {
        overflow-x: scroll;
        display: none;
    }
}