/* clearfix */
.clearfix {
    clear:both;
}
/* wrapper css */
#wrapper{
    margin-bottom: 20px;
    width:100%;    display: block;
}
#wrapper .hgroup{
    text-align:center;
}

#container{
    position:relative;
    padding-bottom: 10px;
    overflow: hidden;

}
.grid{
    width:240px;
    min-height:100px;
    font-size:12px;
    float:left;
   /* -webkit-transition: top 1s ease, left 1s ease;
    -moz-transition: top 1s ease, left 1s ease;
    -o-transition: top 1s ease, left 1s ease;
    -ms-transition: top 1s ease, left 1s ease;*/
}
.grid .pubu_p{font-weight: normal;font-size: 14px;height:45px;color: #666;text-align: center;display: block;padding-top:15px;background-color: #fafafa}

.grid span{font-weight: normal;font-size: 14px;height:45px;color: #666;text-align: center;display: block;padding-top:15px;background-color: #fafafa}


.grid i{display: block;margin:0 auto 30px auto;width: 21px;height:3px;background-color: #525252;}

.imgholder{background-color:#fff;padding:10px;}
/*.imgholder img{width: 240px;}*/
.imgholder a{width: 100%;display: block;}

.grid strong {
    border-bottom:1px solid #ccc;
    margin:10px 0;
    display:block;
    padding:0 0 5px;
    font-size:17px;
}
.grid .meta{
    text-align:right;
    color:#777;
    font-style:italic;
}
.grid .imgholder img{
    max-width:100%;
    display:block;
    cursor: pointer;
    transition: .5s;
    -webkit-transition:.5s;
   
}
.recommend .grid .imgholder img
{
    height:200px;
}

@media screen and (max-width : 1240px) {
    body{
        overflow:auto;
    }
}
@media screen and (max-width : 900px) {
    #wrapper{
        margin-top:90px;
    }
}

.ex_more{  margin: -25px auto 100px auto;display:block;transition:.5s;-webkit-transition:.5s;background:url("../images/ex_24.png") no-repeat 134px center;text-indent:70px;border-radius:27px;border:1px solid #b3b2b2;width: 208px;height:54px;line-height: 54px;}
.ex_more:hover{border-color:#ff9a35;color:#ff9a35;background:url("../images/ex1_24.png") no-repeat 134px center;}