body {
    padding-top: 70px;
    min-width:340px;
}

#main-content .panel {
    background: #ececec;
    border-radius: 0;
}

#main-content .panel>.panel-heading {
    border-radius: 0;
    font-size: 16px;
    font-weight: bold;
    color: #647687 ;
}

#main-content .panel>.panel-body {
    background: #fff;
    margin: 5px 15px 30px 15px;
    border-radius: 5px;
}

/** article-list **/
#main-content.article-list {
}

.article-list .page-heading {
    background: #fff;
    margin-bottom: 20px;
    height: 90px;
    line-height: 90px;
    text-indent: 20px;
    color: #d80073;
    font-family:"Open Sans",Helvetica, Arial, sans-serif;
    font-size: 24px;
    border-radius: 5px;
}

@media screen and (min-width: 768px) {
    .article-list .page-heading {
        font-family:'Open Sans',Helvetica,Arial,sans-serif;
    }

    .main-body {
        font-family: 'Open Sans',Helvetica,Arial,sans-serif;
    }
}

.article-list .tile-group .tile {
    background-image: url(/s/images/article-pic-placeholder.png);
    background-size: 100%;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='/s/images/article-pic-placeholder.png', sizingMethod='scale');
}

.article-list .tile-group .tile.double,.article-list .tile-group .tile.quadro {
    background-image: url(/s/images/article-pic-placeholder2.png);
}

.article-list .tile-group .tile a {
    height: 100%;
    width: 100%;
    display: block;
}

.article-list .tile-group .tile img {
    height: 100%;
}

.article-list .tile-group .tile.double img,.article-list .tile-group .tile.quadro img {
    width: 100%;
    height: auto;
    min-height: 100%;
}

.article-list .tile-group .tile .over-lay {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #52c3d3;
    background: rgba(0,0,0,0.4);
}

.article-list .tile-group .tile .over-lay>a {
    color: #fff;
    font-weight: bold;
    font-size: 12px;
    height: 100%;
    width: 100%;
    display: block;
    padding: 5px;
    text-decoration: none;
}

.article-list .tile-group .tile .over-lay>a:hover {
    text-shadow: none;
}

.article-list .tile-group .tile:hover .over-lay {
    background: rgba(0,0,0,0.7);
}

/* not in use below */
#main-content.article-list .panel>.panel-body .article-meta {
    margin-bottom: 20px;
}

#main-content.article-list .panel>.panel-body .article-meta article {
    display: block;
    width: 100%;
    height: 240px;
    position: relative;
    overflow: hidden;
    background-image: url(/s/images/article-pic-placeholder.png);
    background-size: 100% 100%;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='/s/images/article-pic-placeholder.png', sizingMethod='scale');
}

#main-content.article-list .panel>.panel-body .article-meta article img {
    width: 100%;
    height: 240px;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner {
    display: block;
    width: 100%;
    background: rgb(118,205,218);
    background: rgba(118,205,218,0.7);
    position: absolute;
    left: 0;
    color: #fff;
    padding: 6px 5px;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner>.inner-title {
    height: 50px;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner>.inner-title>a {
    color: #fff;
    font-weight: bold;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner>.inner-title>a:hover {
    color: #eee;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner>.inner-text {
    height: 190px;
}

#main-content.article-list .panel>.panel-body .article-meta article>.meta-inner {
    top: 190px;
    transition: top 1s;
    -moz-transition: top 1s;
    /* Firefox 4 */
    -webkit-transition: top 1s;
    /* Safari and Chrome */
    -o-transition: top 1s;
    /* Opera */
}

#main-content.article-list .panel>.panel-body .article-meta article:hover>.meta-inner {
    top: 0;
}

/** category-list **/
#main-content.category-list {
}

#main-content.category-list .panel>.panel-body .article-meta {
    margin-bottom: 20px;
}

#main-content.category-list .panel>.panel-body .article-meta article {
    display: block;
    width: 100%;
    height: 200px;
    position: relative;
    overflow: hidden;
    background-image: url(/s/images/article-pic-placeholder.png);
    background-size: 100% 100%;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='/s/images/article-pic-placeholder.png', sizingMethod='scale');
}

#main-content.category-list .panel>.panel-body .article-meta article a {
    height: 100%;
    width: 100%;
    display: block;
}

#main-content.category-list .panel>.panel-body .article-meta article img {
    width: 100%;
    height: 100%;
    transition: all 0.6s ease 0s;
}

#main-content.category-list .panel>.panel-body .article-meta article img:hover {
    transform: scale(1.06,1.06);
}

#main-content.category-list .panel>.panel-body .article-meta article>.meta-inner {
    display: block;
    width: 100%;
    background: rgb(118,205,218);
    background: rgba(214,218,96,0.2);
    filter: alpha(opacity=40);
    position: absolute;
    left: 0;
    bottom: 0;
}

#main-content.category-list .panel>.panel-body .article-meta article>.meta-inner>.inner-title {
    height: 40px;
}

#main-content.category-list .panel>.panel-body .article-meta article>.meta-inner>.inner-title>a {
    color: #ff7f66;
    font-weight: bold;
    display: block;
    height: 40px;
    line-height: 40px;
    text-indent: 20px;
}

#main-content.category-list .panel>.panel-body .article-meta article:hover>.meta-inner>.inner-title>a {
    color: #fff;
}

#main-content.category-list .panel>.panel-body .article-meta article>.meta-inner {
    transition: background 0.5s;
    -moz-transition: background 0.5s;
    /* Firefox 4 */
    -webkit-transition: background 0.5s;
    /* Safari and Chrome */
    -o-transition: background 0.5s;
    /* Opera */
}

#main-content.category-list .panel>.panel-body .article-meta article:hover>.meta-inner {
    background: rgb(255,127,102);
    background: rgba(255,127,102,0.9);
    filter: alpha(opacity=90);
}

@media screen and (max-width: 1300px) {
    #main-content.category-list .panel>.panel-body .article-meta article {
        height:160px;
    }
}

/** article-category **/
#main-content.article-category {
}

#main-content.article-category .panel {
    background: #ececec;
    border-radius: 0;
    padding: 10px;
}

#main-content.article-category .panel>.panel-heading {
    border-radius: 0;
    font-size: 16px;
    font-weight: bold;
}

#main-content.article-category .panel>.panel-body {
}

#main-content.article-category .panel>.panel-body .col-md-12 {
    margin-bottom: 30px;
}

#main-content.article-category .panel>.panel-body .col-md-6 {
    margin-bottom: 15px;
}

#main-content.article-category .panel>.panel-body .col-md-6>.cate-name {
    background: #fff;
    border-radius: 5px;
    padding: 8px 20px;
    font-weight: bold;
    color: #a2a2a2;
}

/* for category page */
.main-body {
    margin-top: 0;
    font-family:"Open Sans",Helvetica,Arial,sans-serif;
}

.main-body .banner-panel>.banner-inner-body {
    position: relative;
    width: 100%;
    height: 480px;
    overflow: hidden;
    background: url("/s/images/about-enki-banner.jpg") center no-repeat;
    background-size: cover;
    color: #fff;
    text-align: center;
}

.main-body .banner-panel>.banner-inner-body .title-info {
    position: absolute;
    bottom: 0;
    width: 100%;
    color: #333;
    padding: 50px 0 20px 0;
    background: linear-gradient(top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.8));
    background: -o-linear-gradient(top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.8));
    background: -ms-linear-gradient(top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.8));
    background: -webkit-linear-gradient(top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.8));
}

.main-body .banner-panel>.banner-inner-body .title-info a{
    text-decoration: none;
    font-size:2.2em;
    font-weight:bolder;
    color:#333;
}

.main-body .banner-panel>.banner-inner-body .title-info .date {
    color: #808080;
}

.main-body .banner-panel>.banner-inner-body>img {
    min-width: 100%;
}

.main-body .banner-panel>.banner-inner-body .big-title {
    display: block;
    margin-top: 27px;
    font-size: 48px;
    /* font-family:cursive,sans-serif; */
    letter-spacing: 5px;
    text-align: right;
    text-transform: uppercase;
}

.main-body .banner-panel>.banner-inner-body a.cat-big-title {
    color: #fff;
}

.main-body .banner-panel>.banner-inner-body a.cat-big-title:hover {
    text-decoration: none;
}

.main-body .banner-panel>.banner-inner-body>.title-share-button>.addthis_sharing_toolbox {
    font-size: 1.8em;
    display: inline-block;
    padding: 5px 20px;
    border-style: solid;
    border-width: 1px 0 1px 0;
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn {
    background: none;
    color: #fff;
    float: left;
    display: block;
    margin: 0 5px;
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn>span {
    background: none;
    text-indent: 0;
    font-family: FontAwesome;
    font-size: 1.2em;
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn>span.aticon-twitter:before {
    content: "\f099";
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn>span.aticon-facebook:before {
    content: "\f09a";
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn>span.aticon-google_plusone_share:before {
    content: "\f0d5";
}

.main-body .banner-panel>.banner-inner-body>.title-share-button .at-share-btn>span.aticon-pinterest_share:before {
    content: "\f0d2";
}

.main-body .article-panel .featrue-panel>.panel-body {
    padding: 0;
}

.main-body .article-panel .featrue-panel>.panel-body>.item {
    width: 25%;
    float: left;
    overflow: hidden;
    /*height:255px;*/
    padding: 5px;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.img {
    width: 100%;
    height: 120px;
    overflow: hidden;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.img>a>img {
    width: 100%;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content {
    width: 100%;
    padding: 10px 0;
    overflow: hidden;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content>.title {
    height: 75px;
    overflow: hidden;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content>.title>a {
    color: #000;
    font-weight: 700;
    font-size: 1.2em;
    text-decoration: none;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content>.author {
    float: right;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content>.author>a {
    color: #000;
    text-decoration: none;
}

.main-body .article-panel .featrue-panel>.panel-body>.item>.content>.author>a>img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-left: 10px;
}

.main-body .article-panel>.article-inner-body {
    /* width:980px; */
    margin: 0 auto;
}

.main-body .article-panel>.article-inner-body>.panel {
    background: none;
    border: none;
    box-shadow: none;
    margin-top: 20px;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-heading {
    font-size: 1.5em;
    border-bottom: 1px solid #000;
    padding: 5px;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body {
    margin-top: 10px;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body>.row {
    height: 400px;
    overflow: hidden;
    position: relative;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body>.row.fall-hidden {
    opacity: 0;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body>.row.no-pic-row {
    background: #569df5;
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body>.row+.row {
    margin-top: 20px;
    /*padding:0 15px;*/
}

.main-body .article-panel>.article-inner-body>.panel>.panel-body>.row>a>.overlay>.article-title {
    font-size: 2.5em;
    font-weight: 700;
    display: block;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row {
    height: 220px;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a:hover {
    text-decoration: none;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>img {
    margin-top: 30px;
    height: 160px;
    width: 285px;
    float: right;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay {
    max-height: 165px;
    overflow: hidden;
    margin-top: 20px;
    color: #000;
    padding: 0 40px 0 0;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay>.article-title {
    font-size: 2em;
    max-height: 3em;
    padding: 5px 0;
    overflow: hidden;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay>.article-content {
    line-height: 1.4em;
    font-size: 1.4em;
    /*font-family: "Georgia","Time New Roman","Helvetica",sans-serif;*/
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.count {
    position: absolute;
    bottom: 10px;
    left: 0;
    font-size: 0.9em;
    color: #808080;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.count>div {
    display: inline-block;
    margin-right: 10px;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.count>div>span {
    margin-right: 5px;
    width: 18px;
    height: 20px;
    display: block;
    float: left;
    background: url(/s/images/count-icon2.png) no-repeat scroll 0 0;
}

.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.count>div.last-upv>span {
    background-position: -36px 0;
}

/* moblie */
@media screen and (max-width: 767px) {
    .main-body .banner-panel>.banner-inner-body {
        height:250px;
        background-position: 0 0;
    }

    .main-body .banner-panel>.banner-inner-body .big-title {
        font-size: 2em;
        /* margin-top: 70px; */
    }

    .main-body .article-panel>.article-inner-body {
        width: 100%;
    }

    .main-body .article-panel>.article-inner-body>.panel>.panel-body>.row {
        margin: 0;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row {
        height: auto;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay {
        padding: 0;
        max-height: none;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>img {
        width: 100%;
        float: none;
        height: auto;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.count {
        position: static;
    }

    .main-body .article-panel .featrue-panel>.panel-body>.item {
        width: 100%;
    }

    .main-body .article-panel>.article-inner-body>.panel>.panel-heading {
        text-align: center;
        font-size: 1.5em;
    }

    .main-body .article-panel>.article-inner-body>.latest-panel {
        font-size: 0.7em;
    }

    .main-body .article-panel .featrue-panel>.panel-body>.item>.content>.title {
        height: auto;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>img,.main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay {
        margin-top: 0;
    }

    .main-body .article-panel .featrue-panel>.panel-body>.item>.img {
        height: auto;
    }
}

.latest-more {
    margin-top: 20px;
    color: #808080;
    border: 1px solid #808080;
    padding: 6px 35px;
    border-radius: 20px;
    cursor: pointer;
    display: inline-block;
    transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -webkit-transition: all 0.2s;
}

.latest-wrapper {
    margin: 0 auto;
    display: block;
    width: 250px
}

.latest-more:hover {
    color: #000;
    border-color: #000;
    text-decoration: none;
}

.pagination>.page {
    font-size: 1.2em;
    color: #569df5;
    padding: 0 10px;
    cursor: pointer;
}

.pagination>.page.current {
    font-weight: 700;
    color: #4e4e4e;
    cursor: default;
    text-decoration: none;
}

/* 1366 list */
@media(min-width: 768px) {
    .container>.row>.featured-panel>.panel-body .item>div {
        /* width:205px; */height: 165px;
    }
}

@media(min-width: 1200px) {
    .container>.row>.featured-panel>.panel-body .item>div {
        /* width:235px; */height: 190px;
    }
}

@media(min-width: 1400px) {
    .container>.row>.featured-panel>.panel-body .item>div {
        /* width:270px; */height: 219px;
    }
}

/*@media(min-width: 1600px) {
    .container>.row>.featured-panel>.panel-body .item>div {
        !* width:285px; *!height: 254px;
    }
}*/

@media(max-width: 1200px) and (min-width:768px) {
    .container>.row>.contributor-panel>.panel-body>.contributor-list .item {
        width:33.33%;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item .overlay .content {
        max-height: 87px;
        overflow: hidden;
    }
}

@media(min-width: 768px) {
    .container {
        padding-left:0;
        padding-right: 0;
    }

    #main-content .panel .panel-body {
        padding: 15px 0 15px 11px;
    }
}

@media(min-width: 1600px) {
    .container {
        /* padding-left:15px; */
        /* padding-right: 15px; */
    }

    #main-content .panel .panel-body {
        padding: 15px;
    }
}

/* moblie list */
@media(max-width: 767px) {
    .article-list .tile-group .tile.double {
        width:49% !important;
        height: 120px !important;
        margin-right: 1% !important;
    }

    .article-list .tile-group .quadro+.tile.double {
        width: 100% !important;
        height: 150px !important;
        margin-right: 1% !important;
    }

    .main-body .article-panel>.article-inner-body>.panel.latest-panel>.panel-body>.row>a>.overlay>.article-title {
        padding-top: 10px;
    }
}

/* fall loading */
.fall-loading {
    width: 100%;
    text-align: center;
    float: left;
    color: #32b7b6;
    font-size: 25px;
    display: none;
}

.fall-loading>img {
    width: 30px;
    margin: 10px;
}

#main-content .fall-hidden {
    opacity: 0;
}

.container>.row>.featured-panel {
    padding: 0;
}

.container>.row>.featured-panel .item {
    float: left;
    width: 100%;
    overflow: hidden;
}

.container>.row>.featured-panel .item:first-child {
}

.container>.row>.featured-panel .item>div {
}

.container>.row>.featured-panel .item a {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative;
}

.container>.row>.featured-panel .item a .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
    font-size: 1.2em;
    color: #fff;
    font-weight: 700;
    width: 100%;
    background: linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.2));
    background: -o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.2));
    background: -ms-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.2));
    background: -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.2));
}


#carousel-featured .carousel-control-featured {
    display: block;
    position: absolute;
    top: 35%;
    width: 30px;
    height: 55px;
    background-repeat: no-repeat;
}

#carousel-featured .carousel-control-featured.left {
    left: -1px;
    background-image: url(/s/images/arrow-left.png);
}

#carousel-featured .carousel-control-featured.right {
    right: -2px;
    background-image: url(/s/images/arrow-right.png);
}

@media (min-width: 768px) {
    .container > .row > .featured-panel .item a img {
        min-height: 100%;
        height: 100%;
    }

    #carousel-featured .carousel-inner .item .col-sm-3 {
        padding: 0;
        width: 23.5%;
        margin-right: 2%;
    }

    #carousel-featured .carousel-inner .item .col-sm-3:last-of-type {
        margin-right: 0;
    }

}

@media (max-width: 767px) {

    .container > .row > .featured-panel .item{
        display: block;
    }

    .container > .row > .featured-panel .item a img {
        margin-top: 15px;
        min-width: 100%;
        min-height: 100%;
    }
    #carousel-featured a.carousel-control-featured {
        display: none;
    }
}




.container>.row>.latest-panel>.panel-body .cate-list .data-filter {
    margin-top: 20px;
}

.container>.row>.latest-panel>.panel-body .cate-list .data-filter span {
    color: #808080;
    border: 1px solid #808080;
    padding: 4px 15px;
    border-radius: 15px;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -webkit-transition: all 0.2s;
}

.container>.row>.latest-panel>.panel-body .cate-list .data-filter span:hover {
    color: #000;
    border-color: #000;
}

.container>.row>.latest-panel>.panel-body .cate-list .data-filter span+span {
    margin-left: 20px;
}

.container>.row>.latest-panel>.panel-body .cate-list .data-filter span.active {
    border-color: #000;
    color: #000;
}

.container>.row>.latest-panel>.panel-body .cate-list .latest-more {
    margin-top: 20px;
    color: #808080;
    border: 1px solid #808080;
    padding: 6px 35px;
    border-radius: 20px;
    cursor: pointer;
    display: inline-block;
    transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -webkit-transition: all 0.2s;
}

.container>.row>.latest-panel>.panel-body .cate-list .latest-more:hover {
    color: #000;
    border-color: #000;
    text-decoration: none;
}

.container>.row>.latest-panel>.panel-body .cate-list .item {
    width: 100%;
    overflow: hidden;
    /* height:200px; */
    padding: 12px 0;
    position: relative;
}

.container>.row>.latest-panel>.panel-body .cate-list .item img {
    width: 159px;
    height: 113px;
    float: left;
}
@media(max-width:767px){
    .container>.row>.latest-panel>.panel-body .cate-list .item img{
        float:none;
        width:100%;
        height:auto;
    }
}

.container>.row>.latest-panel>.panel-body .cate-list .item a {
    color: #000;
}

.container>.row>.latest-panel>.panel-body .cate-list .item a:hover {
    text-decoration: none;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .overlay {
    max-height: 150px;
    overflow: hidden;
    padding-left: 3%;
}
@media(max-width:767px){
    .container>.row>.latest-panel>.panel-body .cate-list .item .overlay{
        padding-left:0;
    }
}

.container>.row>.latest-panel>.panel-body .cate-list .item .overlay .title {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 10px;
    /* padding-left: 6%; */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .overlay .content {
    font-size: 1.1em;
    /* padding-left: 6%; */
    font-family: "Georgia","Time New Roman","Helvetica",sans-serif;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .count {
    position: absolute;
    bottom: 10px;
    left: 0;
    font-size: 0.9em;
    color: #808080;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .count>div {
    display: inline-block;
    margin-right: 10px;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .count>div>span {
    margin-right: 5px;
    width: 18px;
    height: 20px;
    display: block;
    float: left;
    background: url(/s/images/count-icon2.png) no-repeat scroll 0 2px;
}

.container>.row>.latest-panel>.panel-body .cate-list .item .count>div.last-upv>span {
    background-position: -36px 2px;
}





.left-body {
    float: left;
    width: 58%;
    overflow: hidden;
}

.left-body .overlay ul.info {
    margin: 3px;
    padding: 0;
    /* padding-left: 6%; */
    color: #888;
    text-transform: capitalize;
}

.left-body .overlay li {
    list-style: none;
}

.left-body .overlay .info .author {
    width: 35%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.left-body .overlay .info .author span {
    color: #569df5
}

.left-body .overlay .info .date {
    width: 48%;
}

.left-body .overlay .info .count-review {
    width: 11%;
    text-indent: 23px;
    background: url('/s/images/icon_review.png') 0 2px no-repeat;
}

.container>.row>.index-panel .left-body .panel-heading {
    padding-left: 0;
}

.right-body {
    float: left;
    width: 35%;
    margin-left: 6%;
    overflow: hidden;
}

.container>.row>.index-panel .right-body .panel-heading {
    padding-top: 0;
    padding-left: 0;
}

.right-body ul {
    margin: 0;
    padding: 0;
}

.right-body li {
    list-style: none;
}

.right-body a {
    color: #333;
}

.right-body .editor-picks .img {
    width: 18%;
    height: 80px;
    margin-right: 8%;
    text-align: center;
}

.right-body .editor-picks .img img {
    height: 100%;
}

.right-body .editor-picks .title {
    width: 74%;
}

.right-body h3 {
    margin-top: 5px;
    font-size: 14px;
    font-weight: bolder;
    line-height: 1.3em;
    text-transform: capitalize;
}

.right-body .editor-picks .date {
    font-size: 14px;
    color: #b5b5b5;
}

.right-body .editor-picks hr {
    width: 40%;
    margin-left: 25%;
    margin-top: 8px;
    margin-bottom: 14px;
}

.right-body .video-article {
    margin-bottom: 35px;
}

.right-body .video-article a.img {
    display: block;
    position: relative;
}

.right-body .video-article a.img .video-img {
    width: 100%;
}

.right-body .video-article .icon-play {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -35px;
    margin-left: -35px;
}

.right-body .video-article .duration {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 2px 10px;
    background: rgba(255,255,255,.8);
}

.right-body .video-article .title {
    display: block;
    font-size: 14px;
    font-weight: bolder;
    line-height: 1.9em;
    text-align: center;
}

.right-body .video-article .row>div {
    margin-bottom: 10px;
}

.right-body .contribuors-list {
    padding-left: 40px;
}

.right-body .contribuors-list h2 {
    padding-left: 3em;
    padding-bottom: 15px;
    font-size: 18px;
    font-weight: bolder;
}

.right-body .contribuors-list li {
    position: relative;
    margin-bottom: 20px;
}

.right-body .contribuors-list li img {
    width: 55px;
    height: 55px;
    border-radius: 50%;
}

.right-body .contribuors-list li .count {
    position: absolute;
    top: 5px;
    left: 71px;
    width: 52px;
    height: 26px;
    background-color: #569df5;
    border-radius: 26px;
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    text-align: center;
}

.right-body .contribuors-list li .count:after {
    content: '';
    display: block;
    position: absolute;
    top: 9px;
    ; left: -11px;
    width: 0;
    height: 0;
    border-color: transparent;
    border-right-color: #569df5;
    border-width: 4px 6px;
    border-style: solid;
}

.right-body .contribuors-list li:first-of-type .count {
    background-color: #ffc85b;
}

.right-body .contribuors-list li:first-of-type .count:after {
    border-right-color: #ffc85b;
}

.right-body .contribuors-list li .name {
    position: absolute;
    top: 35px;
    left: 65px;
}




@media(max-width: 767px) {
    .left-body,.right-body {
        float:none;
        width: 100%;
    }
}

@media(min-width: 768px) {
    .container>.row>.latest-panel>.panel-body .cate-list .item .overlay .content {
        max-height:60px;
    }
}

@media(min-width: 1200px) {
    .right-body {
        width:360px;
        margin-left: 20px;
    }

    .right-body h3 {
        font-size: 16px;
    }

    .left-body {
        width: 560px;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item .overlay .title {
        font-size: 20px;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item .overlay .content {
        font-size: 16px;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item img {
        width: 197px;
        height: 140px;
    }
}

@media(min-width: 1400px) {
    .left-body {
        width: 860px;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item img {
        width: 225px;
        height: 160px;
    }
}

/*@media(min-width: 1600px) {
    .left-body {
        width: 1060px;
    }

    .container>.row>.latest-panel>.panel-body .cate-list .item img {
        height: 180px;
    }

}*/



/*pagination for category*/
.pagination li a{
    padding: 0 8px;
    font-size: 14px;
    line-height: 1.2em;
    color: #333333;
    background-color:transparent;
    /* border: 1px solid #428bca; */
    border-radius:1.2em;
    margin-left: 6px;
}

.pagination>li:first-child>a, .pagination>li:first-child>span {
    margin-left: 0;
    border-radius:1.2em;
}

.pagination>li:last-child>a, .pagination>li:last-child>span {
    border-radius:1.2em;
}

.pagination>.active>a{
    /* background-color:#53d3c5; */
    /* border-color: #53d3c5; */
}

.pagination>.active>a:hover{
    /*background-color:#44ab9f;*/
}

.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus{
    /*background-color:#53d3c5;*/
    /*border-color: #53d3c5;*/
    /*color:#fff;*/
}
.pagination>.disabled>span, .pagination>.disabled>span:hover, .pagination>.disabled>span:focus, .pagination>.disabled>a, .pagination>.disabled>a:hover, .pagination>.disabled>a:focus{
    color: #999;
    background:none;
    border: none;
    cursor: default;
}

