/* uservoice list */
.news-list{
    background: #fff;
    max-width: 100%;
    padding: 20px;
    font-size: 0;
}
.news-list div{max-width: 980px; margin: 0 auto; display: flex; flex-wrap: wrap;}
.news-list a{display:inline-block; background: #FFF; font-size: 14px; width: 31.33%; margin: 0 1% 20px; text-decoration:none; color:#000;} 
.news-list a figure img{width: 100%;}
.news-list a strong, .news-list a span{display:block; line-height:18pt; padding: 10px;}
.news-list a strong{font-size: 20px; padding:10px 10px 0; font-weight: 600;} 
.news-list a small{ display: inline-block; color: #fff; background: #45cec1; padding: 5px; margin: 10px;}
.news-list a:hover figure{opacity: 0.9;}
.news-list a:hover strong{color:#45cec1;}

/* uservoice detail */
.news-detail{
    background: #fff;
    max-width: 100%;
    padding: 20px;
    margin:0 0 -24px;
}

.news-detail div{max-width: 680px; margin: 0 auto; background: #FFF; overflow: hidden;}
.news-detail div figure img{width: 100%;}
.news-detail div strong, .news-detail div span{display:block; line-height:18pt; padding: 20px;}
.news-detail div strong{font-size: 20px; padding:20px; font-weight: 600; border-bottom: 1px dashed #ccc;} 
.news-detail div small{display: inline-block; color: #fff; background: #45cec1; padding: 5px; margin: 10px;}
.bg-btnmore{ background: #e2e2e2; margin-bottom: -24px; padding: 24px 0;}
.bg-btnmore .btn-more{ margin: auto;}

/* @media */
@media(max-width:780px){
.news-list{padding:10px;}
.news-list div{width: auto; margin: 0 auto;}
.news-list a{width: 48%; margin:0 1% 10px}
.bg-btnmore{ margin-bottom: -12px;}
}

@media(max-width:480px){
    .news-list a{width:auto; margin: 0 0 20px;}
    }