/* Портфолио 
Последнее обновление:19.03.2018
Автор: Alex_Top
*/

/* .box_border- задаем если нужно размер только фото! width:75%; margin:0 auto;*/
/* .img_block -  размер картинки в блоке  width:75%; */
/* .mask- убираем плюс {background-image:none;} */

/* размер изображения 
 .portfolio_category .portfolio_list .img_block {width:35%;}
 */
  /*  category_list */
.portfolio_category .block:hover .mask {opacity:1;}  /* маска для всех*/  
.portfolio_category .category_list .box_border {
	padding:5px;
	margin:0 10px;
	box-shadow:2px 2px 4px rgba(0,0,0,.5);
	}
.portfolio_category .category_list .img_box {padding-top:100%;} /* Пропорции - относительно ширины 100% */ 
  
  /*  portfolio_list */
.portfolio_category .portfolio_list .box_border {
	padding:10px;
	margin:0 10px;
	box-shadow:2px 2px 4px rgba(0,0,0,.5);
	}
.portfolio_category .portfolio_list .img_box {padding-top:75%;} /* Пропорции - относительно ширины 100% */

  /*  portfolio_last */
.portfolio_last .hi:last-child {margin-bottom:0;}  
.portfolio_last .img_box {padding-top:50%;} /* Пропорции - относительно ширины 100% */
.portfolio_last .mask {background-image:none;}
.portfolio_last .box_border {
	padding:10px;
	border:1px solid #D0D0D0;
	}

  /*  portfolio_last effect */
.block:hover .mask .box_info {padding:0 10px; color:#C3C3C3;}
.mask p {position:absolute; bottom:0; right:10px; left:10px; padding:2px 10px; font-size:14px; text-align:center; color:#58D0D3;
	background: rgba(0, 0, 0, 0.5) url("./images/arrow_red.png") no-repeat scroll right center;	
   -webkit-transform:translateY(-100px);
   -moz-transform:translateY(-100px);
   -o-transform:translateY(-100px);
   -ms-transform:translateY(-100px);
   transform:translateX(-100px);
   -ms-filter:"progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter:alpha(opacity=0);
   opacity:0;
   -webkit-transition:all 0.2s ease-in-out;
   -moz-transition:all 0.2s ease-in-out;
   -o-transition:all 0.2s ease-in-out;
   -ms-transition:all 0.2s ease-in-out;
   transition:all 0.5s ease-in-out;
}
.block:hover .mask p {
   -ms-filter:"progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter:alpha(opacity=100);
   opacity:1;
   -webkit-transform:translateY(0px);
   -moz-transform:translateY(0px);
   -o-transform:translateY(0px);
   -ms-transform:translateY(0px);
   transform:translateY(0px);
}