<div class="col-lg-4 col-sm-6 col-xs-12"> 
<div class="grid-item-wrapper"> 
<div class="grid-item-thumbnail"> 
<div class="news-date">$CATEGORY_NAME$</div> 
<a href="$ENTRY_URL$" title="$TITLE$"><img src="$IMG_URL1$" alt="$TITLE$"></a> 
</div> 
<div class="grid-item-content has-thumbnail"> 
<h3><a href="$ENTRY_URL$"><?if(len($TITLE$)>40)?><?substr($TITLE$,0,37)?>...<?else?>$TITLE$<?endif?></a></h3> 
<div class="h_mtr_date"> 
<span class="hm_d hm_user"><a href="$PROFILE_URL$">$USERNAME$</a></span> 
<span class="hm_d hm_views">$READS$</span> 
<span class="hm_d hm_date">$DATE$</span> 
</div> 
<p><?if(len($MESSAGE$)>85)?><?substr($MESSAGE$,0,82)?>...<?else?>$MESSAGE$<?endif?></p> 
<div class="grid-item-more transition5"> 
<a class="btn-ghost" href="$ENTRY_URL$">Подробнее</a> 
</div> 
</div> 
</div> 
</div>

 .h_mtr_date{ 
margin-top:14px; 
margin-bottom:7px; 
font-size:14px; 
color:#818181; 
} 
.h_mtr_date a{ 
color:#818181; 
} 
.hm_d{ 
display:inline-block; 
padding-left:22px; 
padding-right:10px; 
} 
.hm_date{ 
background:url('http://zornet.ru/Aben/ABGEA/Rin/i_time.png') 0px 1px no-repeat; 
} 
.hm_user{ 
background:url('http://zornet.ru/Aben/ABGEA/Rin/i_user.png') 0px 1px no-repeat; 
} 
.hm_views{ 
background:url('http://zornet.ru/Aben/ABGEA/Rin/i_views.png') 0px 1px no-repeat; 
} 
.hm_comm{ 
background:url('http://zornet.ru/Aben/ABGEA/Rin/i_comm.png') 0px 1px no-repeat; 
} 
.hm_cat{ 
background:url('http://zornet.ru/Aben/ABGEA/Rin/i_cat.png') 0px 1px no-repeat; 
} 
 .news-date{position: absolute;top: px;right: 10px;color: #fff;background-color: #2196F3;font-size: 12px;padding: 7px 10px;} 
.col-lg-4, .col-sm-6, 
.col-xs-12 
.col-vs-12{position:relative;min-height:1px;padding-left:10px;padding-right:10px;} 
.col-xs-12{float:left;} 
.col-xs-12{width:100%;} 
.grid-item-content {
 color: rgba(39, 48, 57, 0.65);
 background: #FFFFFF;
 padding: 10px 10px 16px;
 /* padding: 1.4375rem 1.875rem 1rem; */
 position: relative;
 overflow: hidden;
 text-align: center;
 box-shadow:0px 2px 5px rgba(0,0,0,0.2);
 margin:0 0 30px 0;
} 

.grid-item-content h3 {
 font-weight: 400;
 /* margin-bottom: 14px; */
 margin-bottom: 0.875rem;
} 

.grid-item-content.has-thumbnail { 
 border-top: none; 
} 

.grid-item-content .grid-item-more {
 background: #000000;
 position: absolute;
 left: 0;
 bottom: 0;
 height: 100%;
 width: 100%;
 text-align: center;
 visibility: hidden;
 /* opacity: 0; */
} 

.grid-item-content .grid-item-more a { 
 display: inline-block; 
 position: relative; 
 top: 50%; 
 transform: translateY(-50%); 
 z-index: 99; 
} 

.grid-item-wrapper .grid-item-thumbnail img { 
 width: 100%; 
 margin-bottom:5px;
 border: px solid rgba(0, 0, 0, 0.7);
 box-shadow: 0px 0px 27px 1px #000000; 
 object-fit: cover;
 width: 100%;
 max-width: 100%; 
 overflow:hidden; 
 -webkit-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); 
 -moz-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); 
 box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); 
} 

.grid-item-wrapper:hover .grid-item-more { 
 opacity: 0.9; 
 visibility: visible; 
} 

.grid-item-wrapper:hover .grid-item-more a { 
 opacity: 1; 
} 

.grid-area { 
 margin-top: 60px; 
 margin-top: 3.75rem; 
} 

.btn { 
 border: 2px solid #757575; 
 color: #757575; 
 padding: 4px 10px; 
 padding: 0.5rem 1.25rem; 
 text-transform: uppercase; 
 display: inline-block; 
 -webkit-border-radius: 3px; 
 -moz-border-radius: 3px; 
 border-radius: 3px; 
} 

.btn:hover { 
 border-color: #42caad; 
 color: #42caad; 
} 

.btn-ghost { 
 color: #FFF;
 background: #2196f3;
 box-shadow: 0px 0px 10px 3px #2196f3; 
 padding: 4px 10px; 
 text-transform: uppercase; 
 display: inline-block; 
} 

.btn-ghost:hover { 
 color: #FFF; 
 background: #00BFFF;
 box-shadow: 0px 0px 10px 3px #00BFFF; 
} 
@media (min-width:768px){.grid-item-wrapper .grid-item-thumbnail img {height:220px;} 
.grid-item-content{height:150px;} 
} 
@media (min-width:992px){.grid-item-wrapper .grid-item-thumbnail img {height:220px;} 
.grid-item-content{height:150px;} 
} 
@media (min-width:1200px){.grid-item-wrapper .grid-item-thumbnail img {height:180px;} 
.grid-item-content{height:140px;} 
} 
@media (min-width:768px){ .col-sm-6, 
.col-sm-6{width:50%;}} 
@media (min-width:1200px){.col-lg-4, 
.col-lg-4{width:50%;}}