.mediafolio-thumb-wrap{
	background:#fff;
	padding: 5px;
}
.mediafolio-grid{
	border: none;
	-webkit-transition: all .8s linear;
	   -moz-transition: all .8s linear;
		-ms-transition: all .8s linear;
		 -o-transition: all .8s linear;
			transition: all .8s linear;
}
.mediafolio-grid:hover{
	-webkit-transition: all .8s linear;
	   -moz-transition: all .8s linear;
		-ms-transition: all .8s linear;
		 -o-transition: all .8s linear;
			transition: all .8s linear;
}
.mediafolio-grid{
	margin: 0.5%;
	width: 32.3%;
	float: left;
	border: none;
	display: none;
	overflow: hidden;
	position: relative;
}

.mediafolio-caps{
	padding: 10px;
	width: 100%;
	background: #eee;
}
.mediafolio-caps > p{
	color: #000;
	font-size: 14px;
	line-height: 21px;
	margin-bottom: 0;
font-family:"TexGyreHerosRegular";
}
.mediafolio-caps > p > span{
	font-size: 12px;
	line-height: 19px;
	margin-bottom: 0;
font-family:"MontserratRegular";
text-transform: uppercase;
}

 .mediafolio-grid .icon-overlay{background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);bottom: 0;display: block;height: 100%;left: 0;opacity: 0;position: absolute;right: 0;top: 0;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;width: 100%;}
 .mediafolio-grid:hover  .icon-overlay{opacity: 1;}
 .mediafolio-grid .icon-holder span {position: absolute;}
 .mediafolio-grid .icon-holder span:nth-of-type(1) {bottom: 0;left: 50%;margin: 0 0 -20px -42px;visibility: hidden;opacity: 0;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}
 .mediafolio-grid .icon-holder span:nth-of-type(2) {top: 0;right: 50%;margin: -20px -42px 0 0;visibility: hidden;opacity: 0;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}
 .mediafolio-grid:hover .icon-holder span:nth-of-type(1) {bottom: 50%;visibility: visible;opacity: 1;}
 .mediafolio-grid:hover .icon-holder span:nth-of-type(2) {top: 50%;visibility: visible;opacity: 1;}

.rounded-icon {
	-webkit-transition: all .8s linear;
	   -moz-transition: all .8s linear;
		-ms-transition: all .8s linear;
		 -o-transition: all .8s linear;
			transition: all .8s linear;background-color: #fff; border: medium none;display: inline-block !important;float: none !important;font-size: 14px;font-weight: normal;height: 40px;line-height: 40px;margin: 0 2px;text-align: center;width: 40px;-webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;border-radius: 50%;-webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);-moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);-ms-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);-o-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);}
.rounded-icon  > a {color: #000;display: block;font-weight: normal;}
.rounded-icon:hover {background-color: red; 
	-webkit-transition: all .8s linear;
	   -moz-transition: all .8s linear;
		-ms-transition: all .8s linear;
		 -o-transition: all .8s linear;
			transition: all .8s linear;}
.rounded-icon:hover  > a {color: #fff;}


/*resets*/
.inline-content{
	display: none;
}
.vbox-inline{
	width: 100%;
	min-width: 300px;
	max-width: 80%;
}