/*news*/
ul.news{padding: 15px; width: calc(100% - 30px); margin: 0px; list-style: none; float:left;}
ul.news li{position: relative; padding: 20px 0 20px 0;  border-bottom: #d6d6d6 1px solid; width: 100%; float:left;}
ul.news li a{float: left;}
ul.news li a i{color: #828282;}
ul.news li a.img{ width:200px; margin-right: 15px;}
ul.news li a.img img{ width: 100%; height: auto; max-width: 100%;}
ul.news li a.img img:hover{opacity: 0.8; border-color: #f1ca28;}
ul.news li i.fa0{display: none;}
ul.news li div.info{float: left;position: relative; width: calc(100% - 220px); }
ul.news li h3,
ul.news li h2{float: left;width:100%; margin: 0px; font-weight: normal;}
ul.news li h3{font-size: 16px;}
ul.news li h2{font-size: 24px;}
ul.news li h3 i.fa,
ul.news li h2 i.fa{font-size: 16px; color: #828282; float: left; margin: 6px 6px 0 0;}
ul.news li h3 i.fb,
ul.news li h2 i.fb{margin-left: 6px;}
ul.news li h3 i.fa-star,
ul.news li h2 i.fa-star{color:red; position: relative; animation: hot-star 1s infinite;}

@keyframes hot-star{ 0% {color:red;} 25% {color:yellow;} 50% {color:red;} 75% {color:yellow;} 100% {color:red;} }

ul.news li h3 i.fa0,
ul.news li h2 i.fa0,
ul.news li h3 i.fa1,
ul.news li h2 i.fa1{display: none;}
ul.news li div.info div{float: left;width:100%; margin:15px 0 0px 0;color: #3c3c3c;}
ul.news li div.info div.relative-time{ margin-top:5px; color:#8B8B8B; }


@media screen and (max-width:700px){	
	ul.news li a.img{width: 150px;} 
	ul.news li div.info{ width: calc(100% - 170px);} 
	ul.news li div.info div{display:none;}	
}

@media screen and (max-width:300px) {	
	ul.news li a.img{width: 100%; margin: 0px;} 
	ul.news li div.info{  width: 100%;} 
}