
.work{
	font-size: 22px;
	text-transform: uppercase;
	padding-top: 0;
	padding-bottom: 20px
}
.work .box{
	display: inline-block;
	/*height: 310px;*/
	/*height: auto;*/
	max-height: 320px;
	width: 100%;
	overflow: hidden;
	background: #FFE2E2 none repeat scroll 0 0;
	border: medium none;
	padding: 30px;
	position: relative;

}
.work .box .hoverBox{
	/*background: rgba(48,57,92,0.9);*/
	background: rgba(255,199,199,0.9);
	position: absolute;
	bottom: -100%;
	height: 100%;
	width: 100%;
	padding: 45px 0 0;
	opacity: 0;
	font-weight: 600;
	font-size: 11px;
	text-align: center;
	left: 0;
	z-index: 100;
}
.work .box:hover .hoverBox{
	opacity: 1;
	bottom: 0;
	transition: all .7s ease;

}

.work .box .hoverBox h2 {
	font-size: 22px;
	text-transform: uppercase;
	padding-top: 0;
	padding-bottom: 20px
}

.work .box img {
	display: block;
	margin: 0 auto;
	max-height: 310px;
	/*height: auto;*/
	z-index: 10;
	position: relative
}

.work .box:hover img {
	-webkit-filter: grayscale(1);
	filter: grayscale(1)
}

.work .box .hoverBox h3{
	color: white;
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	margin-top: 35%;
}
.work .box .hoverBox h5{
	color: white;
	font-size: 18px;
}

.work .detail{
	background: #fff;
	display:block;
	height: 350px;
	overflow: auto;
}

.work .detail h3{
	padding: 15px 0px 10px 0px;
	text-align: center;
	font-size: 2em;
	font-weight: bolder;
	/*font-family: 'Spirax', cursive;*/
	color: #3CAE6B;
}

.work .detail .img{
	display: block;
    margin: auto;
    width: 15%;
	border-radius: 50%;
}