.view {  
  width: 32%;  
  min-width: 300px;  
  height: 200px;  
  margin: 5px;  
  float: left;  
  border: 10px solid #1A2530;  
  overflow: hidden;  
  position: relative;  
  text-align: center;  
  cursor: default;  
}  
.view .mask, .view .content {  
  width: 100%;  
  height: 200px;  
  position: absolute;  
  overflow: hidden;  
  top: 0;  
  left: 0  
}  
.view img {  
  display: block;  
  position: relative  
}  

.view h2 {  
  text-transform: uppercase;  
  color: #fff;  
  text-align: center;  
  position: relative;  
  font-size: 14px;  
  padding: 10px;  
  background: rgba(0, 0, 0, 0.8);  
  margin: 5px 0 0 0  
}  
.view p {  
  font-family: Georgia, serif;  
  font-style: italic;  
  font-size: 12px;  
  position: relative;  
  color: #fff;  
  padding: 10px 20px 20px;  
  text-align: center  
}  
.view a.info {  
  width: 100%;  
  height: 100%;  
  display: inline-block;  
  text-decoration: none;  
  padding: 7px 14px;  
  background: #1A2530;  
  color: #fff;  
  text-transform: uppercase;  
  box-shadow: 0 0 1px #000  
}  
.view a.info:hover {  
  box-shadow: 0 0 5px #000  
}  
.view-tenth img {  
  transform: scaleY(1);  
  transition: all 0.7s ease-in-out;  
}  
.view-tenth .mask {  
  background-color: rgb(26, 37, 48);  
  transition: all 0.5s linear;  
  opacity: 0;  
}  
.view-tenth h2{  
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);  
  background: transparent;  
  margin: 5px 40px 0px 40px;  
  transform: scale(0);  
  color: #fff;  
  transition: all 0.5s linear;  
  opacity: 0;  
}  
.view-tenth p {  
  color: #DC143C;  
  opacity: 0;  
  transform: scale(0);  
  transition: all 0.5s linear;  
}  
.view-tenth a.info {  
  opacity: 0;  
  transform: scale(0);  
  transition: all 0.5s linear;  
}  
.view-tenth:hover img {  
  transform: scale(10);  
  opacity: 0;  
}  
.view-tenth:hover .mask {  
  opacity: 1;  
}  
.view-tenth:hover h2,  
.view-tenth:hover p,  
.view-tenth:hover a.info{  
  transform: scale(1);  
  opacity: 1;  
}  
/* иконка title  
----------------------------------------------- */  
.uCozz2 {  
  position: absolute;  
  bottom: 0px;  
  width: 100%;  
  height: auto;  
  display: block;  
  background-color: #141d26;  
  text-align: center;  
  line-height: 13px;  
  color: #ccc;  
  text-transform: uppercase;  
  font-weight: bold;  
  font-size: 14px;  
  opacity: 0.75;  
  padding:10px;  
}

<div class="view view-tenth">  
  <img src="$IMG_URL1$" width="300" height="270" alt="$TITLE$"><div class="uCozz2">$TITLE$</div>  
  <div class="mask"><a href="$ENTRY_URL$" class="info">  
  <h2>$TITLE$</h2>  
  <p>$CATEGORY_NAME$</p>  
<?if(len($MESSAGE$)>95)?><?substr($MESSAGE$,0,95)?>.....<?else?>$MESSAGE$<?endif?>  
  </a>  
  </div>  
</div>